相簿美化

經看書做出一個美化的相簿，我覺得超看的。
相信自己的眼睛。
http://140.135.8.203/example/pic.html

jQuery 手冊 - 選擇器

最近在看有關於使用jQuery感覺可以很輕鬆的使用javascript
http://jquery.shian.tw/?m=selectors

製作帶自動提示的文字方塊

主要製作方法可以看jquery這本書的範例
9-10.html

裡面有好多javascript的方法與屬性
有時常會忘記，因此下列幾的個我在看這9-10html的常忘記的幾項方法
1.
定義與方法:
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
例如:
<script type="text/javascript">

var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))

</script>
輸出:

0
-1
6

2.

定義與方法:

removeChild()

javascript中用removeChild删除子节点(对象)
 

<TABLE>
<TR>
        <TD id=tn>要刪除的地方</TD>
</TR>
<TR>
        <TD>保留</TD>
</TR>
</TABLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
elem=document.getElementById("tn")
elem.parentNode.removeChild(elem)
//-->
</SCRIPT>

3.
定義與方法
substring(start,end)

返回位于 String 对象中指定位置的子字符串。
start
指明子字符串的起始位置，该索引从 0 开始起算。
end
指明子字符串的结束位置，该索引从 0 开始起算。
例如:
function SubstringDemo(){
   var ss;                         // 声明变量。
   var s = "The rain in Spain falls mainly in the plain..";
   ss = s.substring(12, 17);   // 取子字符串。
   return(ss);                     // 返回子字符串。
}

重點在於如改變mouseover

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>動態新增</title>
<style>
<!--
.datalist{
    border:1px solid #0058a3;    /* 表格邊框 */
    font-family:Arial;
    border-collapse:collapse;    /* 邊框重疊 */
    background-color:#eaf5ff;    /* 表格背景色 */
    font-size:14px;
}
.datalist caption{
    padding-bottom:5px;
    font:bold 1.4em;
    text-align:left;
}
.datalist th{
    border:1px solid #0058a3;    /* 行名稱邊框 */
    background-color:#4bacff;    /* 行名稱背景色 */
    color:#FFFFFF;                /* 行名稱顏色 */
    font-weight:bold;
    padding-top:4px; padding-bottom:4px;
    padding-left:12px; padding-right:12px;
    text-align:center;
}
.datalist td{
    border:1px solid #0058a3;    /* 單元格邊框 */
    text-align:left;
    padding-top:4px; padding-bottom:4px;
    padding-left:10px; padding-right:10px;
}

.datalist tr:hover, .datalist tr.altrow{

    background-color:#c4e4ff;    /* 動態變色 */

}

-->
</style>
<script language="javascript">
window.onload=function(){
    var oTr = document.getElementById("member").insertRow(2);    //插入一行
    var aText = new Array();
    aText[0] = document.createTextNode("fresheggs");
    aText[1] = document.createTextNode("W610");
    aText[2] = document.createTextNode("Nov 5th");
    aText[3] = document.createTextNode("Scorpio");
    aText[4] = document.createTextNode("1038818");
    for(var i=0;i<aText.length;i++){
        var oTd = oTr.insertCell(i);
        oTd.appendChild(aText[i]);
    }
}
</script>
</head>
<body>
<table class="datalist" summary="list of members in EE Studay" id="member">
    <caption>Member List</caption>
    <tr>
        <th scope="col">Name</th>
        <th scope="col">Class</th>
        <th scope="col">Birthday</th>
        <th scope="col">Constellation</th>
        <th scope="col">Mobile</th>
    </tr>
    <tr>
        <td>isaac</td>
        <td>W13</td>
        <td>Jun 24th</td>
        <td>Cancer</td>
        <td>1118159</td>
    </tr>
    <tr>
        <td>girlwing</td>
        <td>W210</td>
        <td>Sep 16th</td>
        <td>Virgo</td>
        <td>1307994</td>
    </tr>
    <tr>
        <td>tastestory</td>
        <td>W15</td>
        <td>Nov 29th</td>
        <td>Sagittarius</td>
        <td>1095245</td>
    </tr>
    <tr>
        <td>lovehate</td>
        <td>W47</td>
        <td>Sep 5th</td>
        <td>Virgo</td>
        <td>6098017</td>
    </tr>
    <tr>
        <td>slepox</td>
        <td>W19</td>
        <td>Nov 18th</td>
        <td>Scorpio</td>
        <td>0658635</td>
    </tr>
    <tr>
        <td>smartlau</td>
        <td>W19</td>
        <td>Dec 30th</td>
        <td>Capricorn</td>
        <td>0006621</td>
    </tr>
    <tr>
        <td>whaler</td>
        <td>W19</td>
        <td>Jan 18th</td>
        <td>Capricorn</td>
        <td>1851918</td>
    </tr>
    <tr>
        <td>shenhuanyan</td>
        <td>W25</td>
        <td>Jan 31th</td>
        <td>Aquarius</td>
        <td>0621827</td>
    </tr>
    <tr>
        <td>tuonene</td>
        <td>W210</td>
        <td>Nov 26th</td>
        <td>Sagittarius</td>
        <td>0091704</td>
    </tr>
    <tr>
        <td>ArthurRivers</td>
        <td>W91</td>
        <td>Feb 26th</td>
        <td>Pisces</td>
        <td>0468357</td>
    </tr>
    <tr>
        <td>reconzansp</td>
        <td>W09</td>
        <td>Oct 13th</td>
        <td>Libra</td>
        <td>3643041</td>
    </tr>
    <tr>
        <td>linear</td>
        <td>W86</td>
        <td>Aug 18th</td>
        <td>Leo</td>
        <td>6398341</td>
    </tr>
    <tr>
        <td>laopiao</td>
        <td>W41</td>
        <td>May 17th</td>
        <td>Taurus</td>
        <td>1254004</td>
    </tr>
    <tr>
        <td>dovecho</td>
        <td>W19</td>
        <td>Dec 9th</td>
        <td>Sagittarius</td>
        <td>1892013</td>
    </tr>
    <tr>
        <td>shanghen</td>
        <td>W42</td>
        <td>May 24th</td>
        <td>Gemini</td>
        <td>1544254</td>
    </tr>
    <tr>
        <td>venessawj</td>
        <td>W45</td>
        <td>Apr 1st</td>
        <td>Aries</td>
        <td>1523753</td>
    </tr>
    <tr>
        <td>lightyear</td>
        <td>W311</td>
        <td>Mar 23th</td>
        <td>Aries</td>
        <td>1002908</td>
    </tr>
</table>
</body>
</html>

mouseover and click

http://140.135.8.203/analysis/11_29.php
主要是運用ajax方法
滑鼠移到圖片與點擊圖片時將次數傳到server儲存
所以重整時還是會有累積的效果，正常網頁必須要因該需要重新刷新頁面(因該吧-.-)。

javaScript 的一些方法

1.
javaScript substr和substring的差異如下：

String.substr(N1,N2) ：從N1(指定位置)截取N2（所要截取之字元長度）
String.substring(N1,N2) ：從N1(指定位置)截取到N2(指定位置）

PS. javascript的起始位置是０

2.
下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。 我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应该页面的具体情况。

window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no') //这句要写成一行


参数解释：
window.open 弹出新窗口的命令；
'page.html' 弹出窗口的文件名；
'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空''代替；
height=100 窗口高度；
width=400 窗口宽度；
top=0 窗口距离屏幕上方的象素值；
left=0 窗口距离屏幕左侧的象素值；
toolbar=no 是否显示工具栏，yes为显示；
menubar，scrollbars 表示菜单栏和滚动栏。
resizable=no 是否允许改变窗口大小，yes为允许；
location=no 是否显示地址栏，yes为允许；
status=no 是否显示状态栏内的信息（通常是文件已经打开），yes为允许； js脚本结束

jquery

最近在找ajax發現了這網站，有教學影片感覺不錯。
http://www.jqueryajax.com/jquery522