JavaScript使用手冊

悟靜 2011-02-02

展開全文

JavaScript 簡介
　　JavaScript 是網(wǎng)景（Netscape）公司開發(fā)的一種基于客戶端瀏覽器,、面向（基于）對象,、事件驅(qū)動式的網(wǎng)頁腳本語言,。JavaScript語言的前身叫作Livescript。

JavaScript的特點(diǎn)：
簡單,、易學(xué),、易用,；
跨平臺,；IE、Navigator
符合ECMA（歐洲計算機(jī)制造協(xié)會）標(biāo)準(zhǔn),，可移植,；
事件驅(qū)動式的腳本程序設(shè)計思想；
動態(tài),、交互式的操作方式,。
JavaScript的作用：
交互式操作；
表單驗(yàn)證,；
網(wǎng)頁特效,；
Web游戲
服務(wù)器腳本開發(fā)等。
JavaScript的編寫環(huán)境：文本編輯器

JavaScript的執(zhí)行平臺：Web瀏覽器

JavaScript的執(zhí)行方式：解釋執(zhí)行（由上而下）

JavaScript的版本：JavaScript1.0——JavaScript1.4

瀏覽器對JavaScript的支持：
JavaScript/IE3.0,、JavaScript1.2/IE4.0,；
微軟允許用戶自行設(shè)置對JavaScript處理模式。
JavaScript與Java,、VBScript,、JScript的關(guān)系：
　　 JavaScript與Java的區(qū)別體現(xiàn)在：

　　首先，它們是兩個公司開發(fā)的不同的兩個產(chǎn)品,，Java是SUN公司推出的新一代面向?qū)ο蟮某绦蛟O(shè)計語言,，特別適合于Internet應(yīng)用程序開發(fā)；而JavaScript是Netscape公司的產(chǎn)品，其目的是為了擴(kuò)展Netscape Navigator功能而開發(fā)的一種可以嵌入Web頁面中的基于對象和事件驅(qū)動的解釋性語言,。

　　其次,，JavaScript是基于對象的，而Java是面向?qū)ο蟮?，即Java是一種真正的面向?qū)ο蟮恼Z言,，即使是開發(fā)簡單的程序，必須設(shè)計對象,。JavaScript是種腳本語言,，它可以用來制作與網(wǎng)絡(luò)無關(guān)的，與用戶交互作用的復(fù)雜軟件,。它是一種基于對象和事件驅(qū)動的編程語言,。因而它本身提供了非常豐富的內(nèi)部對象供設(shè)計人員使用。

　　第三,，兩種語言在其瀏覽器中所執(zhí)行的方式不一樣,。Java的源代碼在傳遞到客戶端執(zhí)行之前，必須經(jīng)過編譯,，因而客戶端上必須具有相應(yīng)平臺上的仿真器或解釋器,，它可以通過編譯器或解釋器實(shí)現(xiàn)獨(dú)立于某個特定的平臺編譯代碼的束縛。JavaScript是一種解釋性編程語言,，其源代碼在發(fā)往客戶端執(zhí)行之前不需經(jīng)過編譯,，而是將文本格式的字符代碼發(fā)送給客戶，由瀏覽器解釋執(zhí)行,。

　　第四,，兩種語言所采取的變量是不一樣的。Java采用強(qiáng)類型變量檢查,，即所有變量在編譯之前必須作聲明,。JavaScript中變量聲明，采用其弱類型,。即變量在使用前不需作聲明,，而是解釋器在運(yùn)行時檢查其數(shù)據(jù)類型。

　　第五,，代碼格式不一樣,。Java是一種與HTML無關(guān)的格式，必須通過像HTML中引用外媒體那么進(jìn)行裝載,，其代碼以字節(jié)代碼的形式保存在獨(dú)立的文檔中,。JavaScript的代碼是一種文本字符格式，可以直接嵌入HTML文檔中,，并且可動態(tài)裝載,。編寫HTML文檔就像編輯文本文件一樣方便,。

　　第六，嵌入方式不一樣,。在HTML文檔中,，兩種編程語言的標(biāo)識不同，JavaScript使用<script>...</script>來標(biāo)識,，而Java使用<applet> ... </applet> 來標(biāo)識,。

　　第七，靜態(tài)綁定和動態(tài)綁定,。Java采用靜態(tài)聯(lián)編,，即Java的對象引用必須在編譯時的進(jìn)行，以使編譯器能夠?qū)崿F(xiàn)強(qiáng)類型檢查,，如不經(jīng)編譯則就無法實(shí)現(xiàn)對象引用的檢查,。JavaScript采用動態(tài)聯(lián)編，即JavaScript的對象引用在運(yùn)行時進(jìn)行檢查,。

JavaScript的格式：
JavaScript區(qū)分大小寫,；
JavaScript腳本程序須嵌入在HTML文件中；
JavaScript腳本程序中不能包含HTML標(biāo)記代碼,；（雙引號）
每行寫一條腳本語句,；
語句末尾可以加分號；
JavaScript腳本程序可以獨(dú)立保存為一個外部文件,，但其中不能包含<script></script>標(biāo)簽,。
JavaScript腳本程序的幾種基本格式：
<script>
document.write("Hello World!!!");
</script>

注意：document.write("Hello World!!!"); 必須保存為一個外部文件：hello.js

使用JavaScript協(xié)議：

JavaScript的數(shù)據(jù)類型：
數(shù)值：整數(shù)、浮點(diǎn)數(shù),；
邏輯值：布爾值,；
字符串值：
空值：
未定義值：
JavaScript數(shù)據(jù)的表示：
整數(shù)：由正負(fù)號、數(shù)字構(gòu)成,，八進(jìn)制、十進(jìn)制,、十六進(jìn)制,；
浮點(diǎn)數(shù)：由正負(fù)號、數(shù)字和小數(shù)點(diǎn)構(gòu)成,，常規(guī)記數(shù)法,、科學(xué)記數(shù)法；
邏輯值：true,、false
字符串值：單引號,、雙引號
空值：null
未定義值：根本不存在的對象、已定義但沒有賦值的量,；
JavaScript常量：
布爾常量：true　　false
整數(shù)常量：3721　　0007　　0xaff（0Xaff）
浮點(diǎn)數(shù)常量：3.14　　.001　　3.721e+3　　-3.721E-3
字符串常量："你的E-mail地址有誤,！"
含轉(zhuǎn)義字符的字符串常量：

轉(zhuǎn)義字符意義
\b 退格（Backspace）
\f 換頁（Form feed）
\n 換行（New line）
\r 返回（Carriage return）
\t 制表符（Tab）
\' 單引號（'）
\" 雙引號（"）
\\ 反斜線（\）

document.write("我愛\'JavaScript\'")

document.write("文件在c:\\windows\\下")

document.write("<pre>未滿十八歲\n不得進(jìn)入,！</pre>")

document.write("未滿十八歲<br>不得進(jìn)入！")

document.alert("密碼不對\n請重新輸入,！")

數(shù)組常量：

hobby=["聽音樂","看電影"]
hobby[0],、hobby[1]

hobby=["聽音樂",,"看電影",]
hobby[0]、hobby[1],、hobby[2],、hobby[3]
JavaScript變量：
變量命名規(guī)則：

首字符必須是大寫或小寫的字母或下劃線（_）或美元符（$）;
后續(xù)的字符可以是字母、數(shù)字,、下劃線或美元符;
變量名稱不能是保留字,；
長度是任意；
區(qū)分大小寫,；
約定：集中置頂,；
　　　使用局部變量；
　　　易于理解,；　　stdId
　　　避免混亂,。　　usrname　　usrName

聲明變量：

var stdId;
var name,sex;
var total=3721;
var notNull=true;
var name="李小龍",，sex="先生";
var i=j=0;

變量賦值：

stdId = 2004007;

變量作用域：（方式,、位置）

全局變量：省略var，或在函數(shù)外聲明
局部變量：在函數(shù)內(nèi)聲明
全局變量可在整個腳本中被使用,，可在不同的窗口中相互引用（指定窗口名）
例：
<Script>
var langJS = "JavaScript"; //langJS是全局變量
test();
function test() {
    var langVBS = "VBScript"; //langVBS是局部變量
    document.write("<LI>" + langJS);
    document.write("<LI>" + langVBS);
}

document.write("<LI>" + langJS);
document.write("<LI>" + langVBS);
</Script>

JavaScript表達(dá)式：
算術(shù)表達(dá)式,；
字符串表達(dá)式；
關(guān)系（比較）表達(dá)式,；
邏輯表達(dá)式,。
JavaScript運(yùn)算符：
根據(jù)處理對象的數(shù)目：

單元運(yùn)算符；
二元運(yùn)算符,；
三元運(yùn)算符,。

根據(jù)功能：

賦值運(yùn)算符；

=　　+=　　-=　　*=　　/=　　%=（取余）

算術(shù)運(yùn)算符,；

+　　-　　*　　/　　%（取余）　　++（遞增）　　--（遞減）　-

例１：
<Script>
var x = 11;
var y = 5;

with (document) {
    write("x = 11, y = 5");
    write("<LI>x + y 是 ", x + y);
    write("<LI>x - y 是 ", x - y);
    write("<LI>x * y 是 ", x * y);
    write("<LI>x / y 是 ", x / y);
    write("<LI>x % y 是 ", x % y);
    write("<LI>++ x 是 ", ++ x);
    write("<LI>-- y 是 ", -- y);
}
</Script>

例２：
<Script>
var x = y = 3;

with (document) {
    write("x = 3, y = 3 <br>");
    write("若x = y++ 運(yùn)算之后：");
    x = y++;//y→x,，y+1→y
    write("x 是 ", x, "; y 是 ", y, "<br>");
    write("再作x = ++y 運(yùn)算：");
    x = ++y;//y+1→x，y+1→y
    write("x 是 ", x, "; y 是 ", y);
}
</Script>

字符串運(yùn)算符,；

+　　+=

比較運(yùn)算符,；

==　　!=　　===（值及類型）　　!==（值及類型）
<　　<=　　>　　>=

例：
<Script>
var x = 5; //x 是數(shù)值5
var y = '5'; //y 是字符串5
var z = 6; //x 是數(shù)值6

with (document) {
    write("x = 5, y = '5', z = 6");
    write("<LI>x == y 嗎？", x == y);
    write("<LI>x === y 嗎,？", x === y);
    write("<LI>x != y 嗎,？", x != y);
    write("<LI>x !== y 嗎？", x !== y);
    write("<LI>x <= z 嗎,？", x <= z);
    write("<LI>y <= z 嗎,？", y <= z);
    //類型自動轉(zhuǎn)換
}
</Script>

邏輯運(yùn)算符,；

&&　　||　　!

例１：
<Script>
var t = true;
var f = false;

with(document) {
write("<OL><LI>true && true 的結(jié)果是 ", t && t);
write("<LI>true && false 的結(jié)果是 ", t && f);
write("<LI>false && true 的結(jié)果是 ", f && t);
write("<LI>false && false 的結(jié)果是 ", f && f);
write("<LI>true && (1==1) 的結(jié)果是 ", t && (1==1));
write("<LI>false && 'A' 的結(jié)果是 ", f && 'A');
write("<LI>'A' && false 的結(jié)果是 ", 'A' && f);
write("<LI>true && 'A' 的結(jié)果是 ", t && 'A');
write("<LI>'A' && true 的結(jié)果是 ", 'A' && t);
write("<LI>'A' && 'B' 的結(jié)果是 ", 'A' && 'B');
//&&：有一個不是邏輯值，只要第一個操作數(shù)的值為flase,，則返回第一個操作數(shù)的值flase,，否則，返回第二個操作數(shù)的值
}
</Script>

例２：
<Script>
var t = true;
var f = false;

with(document) {
write("<OL><LI>true || true 的結(jié)果是 ", t || t);
write("<LI>true || false 的結(jié)果是 ", t || f);
write("<LI>false || true 的結(jié)果是 ", f || t);
write("<LI>false || false 的結(jié)果是 ", f || f);
write("<LI>true || (1==1) 的結(jié)果是 ", t || (1==1));
write("<LI>false || 'A' 的結(jié)果是 ", f || 'A');
write("<LI>'A' || false 的結(jié)果是 ", 'A' || f);
write("<LI>true || 'A' 的結(jié)果是 ", t || 'A');
write("<LI>'A' || true 的結(jié)果是 ", 'A' || t);
write("<LI>'A' || 'B' 的結(jié)果是 ", 'A' || 'B');
//||：有一個不是邏輯值,，只要第一個操作數(shù)為的值true,、字符或非零的數(shù)字，則返回第一個操作數(shù)的值,，否則,，返回第二個操作數(shù)的值
}
</Script>

例３：
<Script>
with(document) {
    write("<LI>!true 的結(jié)果是 ", !true);
    write("<LI>!false 的結(jié)果是 ", !false);
    write("<LI>!'A' 的結(jié)果是 ", !'A');
    write("<LI>!0 的結(jié)果是 ", !0);}
</Script>

逐位運(yùn)算符；

特殊運(yùn)算符,。

1,、new運(yùn)算符：創(chuàng)建對象（實(shí)例）

　　　格式：對象名稱=new 對象類型（參數(shù)）

2、this運(yùn)算符：表示當(dāng)前對象

　　　格式：this[.屬性]

例：
<Script>
function validate(obj) {
alert("你輸入的值是："+ obj.value);
} </Script>
請輸入任意字符：<BR>
<INPUT TYPE="text" onKeyup="validate(this)">

3,、條件運(yùn)算符：三元運(yùn)算符

格式：<條件表達(dá)式> ? 第一個值：第二個值

例：
NS = (document.layers) ? 1 : 0;
IE = (document.all) ? 1: 0;

window.screen.width>800 ? imgheight=100:imgheight=100
window.screen.width>800 ? imgleft=15:imgleft=122

<Script>
function showSex() {
onOroff = document.forms[0].sex[0].checked
status = (onOroff)? "帥哥" : "美女"
alert("Hello! " + status)
}
</Script>
請輸入你的性別：
<FORM onClick=showSex()>
<INPUT TYPE=radio NAME=sex>男生
<INPUT TYPE=radio NAME=sex>女生
</FORM>

運(yùn)算符執(zhí)行的優(yōu)先順序：

類型運(yùn)算符
括號 ()
一元 ! ~ - ++ -- typeof void delete
算術(shù) * / + -
位位移 << >> >>>
比較 < <= > >= == !=
位邏輯 & ^（xor） |
邏輯 && ||
三元條件 ?
賦值 = += -= *= /= %= <<= >>= >>>= &= ^= |=

JavaScript語句：
注釋語句：

單行注釋：//注釋文字
多行注釋：/*
　　　　　注釋文字
　　　　　*/

例：
/***************************************
*             源碼之家               *
*        http://www.         *
*      下載:http://www.      *
*     論壇http://www./bbs    *
*****************************************/

with語句：（對象操作語句）

功能：為一段程序建立默認(rèn)對象,。
格式：
with (<對象>){
　　<語句組>
｝

例１：
with (document) {
    write ("限時搶購物品：");
    write ("<Li>ViewSonic 17\" 顯示器。");
    write ("<Li>EPSON 打印機(jī),。");
}

例２：
document.write ("限時搶購物品：");
document.write ("<Li>ViewSonic 17\" 顯示器,。");
document.write ("<Li>EPSON 打印機(jī)。");

if...else語句：

格式1：

if (<表達(dá)式>)
<語句1>;
else
<語句2>;

if (<表達(dá)式>) <語句1>;
else <語句2>;

例：
<Script>
var now = new Date();
var hour = now.getHours();

if (6 < hour && hour < 18)
document.write ("辛勤工作才能快樂收割,！");
else
document.write ("休息一下,，充電后再出發(fā)。");
</Script>

格式2：

if (<表達(dá)式>){
<語句組1>
}else{
<語句組2>
}

格式3：

if (<表達(dá)式1>){
    <語句組1>
}else if (<表達(dá)式2>){
    <語句組2>
}else{
    <語句組3>
}

例1：
<Script>
var now = new Date();
var day = now.getDay();
var dayName;

if (day == 0) dayName = "星期日";
else if (day == 1) dayName = "星期一";
else if (day == 2) dayName = "星期二";
else if (day == 3) dayName = "星期三";
else if (day == 4) dayName = "星期四";
else if (day == 5) dayName = "星期五";
else dayName = "星期六";

document.write ("今天是快樂的", dayName);
</Script>

例2：
<Script>
var now = new Date();
var day = now.getDay();
var dayName;

if (day = 0) dayName = "星期日";
else if (day = 1) dayName = "星期一";
else if (day = 2) dayName = "星期二";
else if (day = 3) dayName = "星期三";
else if (day = 4) dayName = "星期四";
else if (day = 5) dayName = "星期五";
else dayName = "星期六";

document.write ("今天是快樂的", dayName);
</Script>

while語句：

格式1：

while (<表達(dá)式>)
語句,；

格式2：

while (<表達(dá)式>){
<語句組>
}

例：
<Script>
var i = 5;

while ( i > 0 ) {
document.write("i = " ,i ,"<BR>");
i--;
}
</Script>

do...while語句：

格式：

do {
<語句組>
} while (<表達(dá)式>)

例：
<Script>
var i = 5;

do {
document.write("i = " ,i ,"<BR>");
i--;
} while ( i > 0 )
</Script>

for語句：

格式：

for (<初始表達(dá)式>,；<條件表達(dá)式>；<變動量表達(dá)式>){
<語句組>
}

例：
<Script>
for ( var i = 5; i > 0; i-- ) {
document.write("i = " ,i ,"<BR>");
}
</Script>

for...in語句：重復(fù)執(zhí)行指定對象的所有屬性

格式：

for ( 變量 in 對象 ){
<語句組>
}

例：
<Script>
function member(name, sex) {//構(gòu)造函數(shù)member
this.name = name;
this.sex = sex;
}

function showProperty(obj, objString) {
var str = "";
for (var i in obj)
str += objString + "." + i + " = " + obj[i] + "<BR>";
return str;
}

papa = new member("楊宏文", "男生");//建立對象實(shí)例papa
document.write(showProperty(papa, "papa"))
</Script>

break語句：

格式：break

例：
<Script>
var i = 5;
while ( i > 0 ) {
    if ( i == 3 ) break;
    document.write("i = " ,i ,"<BR>");
    i--;
}
</Script>

continue語句：

格式：continue

例：
<Script>
var i = 5;
while ( i > 0 ) {
    i--;
    if ( i == 3 ) continue;
    document.write("i = " ,i ,"<BR>");
}
</Script>

switch語句：

格式：

switch (<表達(dá)式>) {
    case <數(shù)值1>:<語句組1>
                 break;
    case <數(shù)值2>:<語句組2>
                 break;
    ...
    default <語句組>
}

例：
<Script>
function greet(givenSex) {
switch(givenSex) {
    case "帥哥" : alert("你好??！");
                  break;
    case "美女" : alert("你好啊,！");
                  break;
}
}
</Script>
請輸入性別：
<FORM>
<INPUT TYPE="radio" NAME="sex" onClick="greet('帥哥')">
帥哥
<INPUT TYPE="radio" NAME="sex" onClick="greet('美女')">
美女
</FORM>

對象：

對象是一組具有屬性和方法的經(jīng)過組織的數(shù)據(jù),。

默認(rèn)對象：
日期對象；（日期基線：1970年1月1日00：00：00）

建立日期對象(實(shí)例)：

　　格式：日期對象名稱=new Date([日期參數(shù)])

　　日期參數(shù)：1.省略,；
　　　　　　　2.英文-數(shù)值格式：月日，公元年 [時：分：秒]
　　　　　　　　　如：today=new Date("October 1,2008 12:00:00")
　　　　　　　3.數(shù)值格式：公元年,，月,，日，[時,，分,，秒]
　　　　　　　　　如：today=new Date(2008,10,1)

日期對象的方法：

　　格式：日期對象名稱.方法（[參數(shù)]）

獲取當(dāng)?shù)貢r間：
getYear() 返回年份數(shù)
getFullYear() 返回年份數(shù)
getMonth() 返回月份數(shù)（0--11）
getDate() 返回日期數(shù)（1--31）
getDay() 返回星期數(shù)（0--6）
getHours() 返回時數(shù)（0--23）
getMinutes() 返回分?jǐn)?shù)（0--59）
getSeconds() 返回秒數(shù)（0--59）
getMilliseconds() 返回毫秒數(shù)（0--999）
getTime() 返回對應(yīng)日期基線的毫秒
Date.parse(日期字串) 返回對應(yīng)日期基線的毫秒
setTime(時間值) 指定一日期對象的值
toGMTString() 以GMT格式表示日期對象
toUTCString() 以GMT格式表示日期對象

數(shù)組對象,；

建立數(shù)組對象：

　　格式１：數(shù)組對象名稱=new Array([元素個數(shù)])
　　格式２：數(shù)組對象名稱=new Array([[元素1][，元素2,，...]])
　　格式３：數(shù)組對象名稱=[元素1[,，元素2，...]]

　　例：
　　　　 fruit=new Array(3);// fruit=new Array();
　　　　 fruit[0]="蘋果";
　　　　 fruit[1]="梨子";
　　　　 fruit[2]="橘子";

　　　　 fruit=new Array("蘋果",，"梨子",，"橘子");

　　　　 fruit=["蘋果"，"梨子",，"橘子"];

數(shù)組對象的屬性：

　　格式：數(shù)組對象名稱.屬性

　　屬性：length　　數(shù)組長度

　　例：
<Script>
var fruit = new Array("蘋果", "梨子", "橘子");
var i;

for (i=0; i < fruit.length; i++) {
document.write("fruit [", i, "] = ", fruit[i], "<br>")
}

</Script>

數(shù)組對象的方法：

　　格式：數(shù)組對象名稱.方法([參數(shù)])

　　方法： join([分隔符]) 數(shù)組元素組合為字符串
toString() 以字符串表示數(shù)組
reverse() 數(shù)組反轉(zhuǎn)
valueOf() 返回數(shù)組值

　　例：
<Script>
var fruit = new Array("蘋果", "梨子", "橘子");

document.write("<LI>", fruit.join());
document.write("<LI>", fruit.join(",、"));
document.write("<LI>", fruit.toString());
document.write("<LI>", fruit.reverse().join());
document.write("<LI>", fruit.valueOf());

</Script>

二維數(shù)組：

　　例：
<Script>
var fruit = new Array(3);
fruit[0] = new Array("蘋果", 2);
fruit[1] = new Array("梨子", 4);
fruit[2] = new Array("橘子", 2);

for (i=0; i < fruit.length; i++) {
for (j=0; j < fruit[0].length; j++) {
document.write("fruit [", i, "][", j, "] = ", fruit[i][j],"<br>");
}
document.write("<br>");
}

</Script>

字符串對象；

建立字符串對象：

　　格式：字符串對象名稱=new String(字符串常量)
　　格式：字符串變量名稱="字符串常量"

字符串對象的屬性：

　　格式：字符串對象名稱.屬性

　　屬性：length　　字符串長度

字符串對象的方法：

　　格式：字符串對象名稱.方法

　　方法： bold() 粗體
italtics() 斜體
strike() 刪除線
fontsize(字級大小) 文字大小
fontcolor(#rrggbb) 文字顏色
sup() 上標(biāo)
sub() 下標(biāo)
toUpperCase() 大寫
toLowerCase() 小寫
charAt(索引) 返回索引位置的字符
charCodeAt(索引) 返回索引位置的ASCII字符碼,，十進(jìn)制表示
indexOf("字串"[,索引]) 返回字串在對象中的索引位置
lastIndexOf("字串"[,索引]) 返回字串在對象中的索引位置（反向搜索）
search("字串") 返回字串在對象中的索引位置
replace("字串1","字串2") 字串2替換字串1
slice(索引i[,索引j]) 返回索引i倒索引j-1的子串
split(["字串"][,限制]) 將字串從對象中刪除
substr(start[,length]) 返回特定長度的字串
substring(索引i[,索引j]) 返回索引i倒索引j-1的子串
link("url") 設(shè)置鏈接
match(/匹配字符/) \d
匹配一個數(shù)字字符,。

\D
匹配一個非數(shù)字字符。

\n
匹配一個換行符,。

\r
匹配一個回車符,。

\s
匹配一個空格符。

\S
匹配任意非空格符,。

\t
匹配一個table符,。

\W
匹配任何非單詞符。

\num
匹配正整數(shù)num,。

/n/
匹配八進(jìn)制,，十六進(jìn)制，十進(jìn)制的escape值,。

toString() 返回字符串
valueOf() 返回字符串值

　　例1：
<Script>
var str = "JavaScript";

document.write(str.bold(),"<BR>");
document.write(str.fixed(),"<BR>");
document.write(str.fontcolor("red"),"<BR>");
document.write(str.fontsize(5),"<BR>");

</Script>

　　例2：
<Script>

var str = "JavaScript";
var num = 1234;

document.write(str.toUpperCase(), "<BR>");
document.write(num.toString().charAt(2),"<BR>");
document.write(str.substring(0,4), "<BR>");
</Script>

　　例3：
<Script>

var str = "JavaScript";
document.write(str, " 有 ", str.length, " 個字<BR>");
document.write(str.fontcolor("green"), " 不是 ");
document.write(str.substr(0,4).fontcolor("red"));
document.write(" 也不是 ", str.replace("Java", "VB"));

</Script>

　　例4：
<Script>

var str = "[email protected]";
var idx = str.search("@");
var usr = str.substr(0,idx);
document.write(usr.toUpperCase().fontsize(7), "<BR>");
document.write("你的電子信箱是", str);

</Script>

　　例5：
<Script>
function isEmail(){
var str = document.form1.add.value;
if (str.indexOf("@") == -1)
alert("請?zhí)顚懻_的EMail地址");
else
alert("OK!");
}

</Script>

<FORM name="form1">
請輸入你的 EMail 地址：
<INPUT TYPE="text" name="add">
<INPUT TYPE="button" value="開始檢查" onClick="isEmail()">
</FORM>

布爾對象,；

建立布爾對象：

　　格式：布爾對象名稱=new Boolean(轉(zhuǎn)換值)
　　轉(zhuǎn)換值：null、未定義,、0,、或false均轉(zhuǎn)換成false

布爾對象的方法：

　　格式：布爾對象名稱.方法
　　方法：toString()
　　　　　valueOf()
　　例：
<Script>
x = new Boolean();
y = new Boolean(true);
z = new Boolean(0);

document.write(x, "<br>");
document.write(y, "<br>");
document.write(z, "<br>");

</Script>

數(shù)學(xué)對象；（靜態(tài)對象）

數(shù)學(xué)對象的屬性：

　　格式：Math.屬性
　　屬性： E 自然對數(shù)的底數(shù)
LN2 2的自然對數(shù)
LN10 10的自然對數(shù)
LOG2E 以2為底e的對數(shù)
LOG10E 以10為底e的對數(shù)
PI 圓周率
SQRT1_2 1/2的平方根
SQRT2 2的平方根

數(shù)學(xué)對象的方法：

　　格式：Math.方法（參數(shù)）
　　方法： ceil(數(shù)值) 大于等于該數(shù)值的最小整數(shù)
floor(數(shù)值) 小于等于該數(shù)值的最大整數(shù)
min(數(shù)值1,數(shù)值2) 最小值
max(數(shù)值1,數(shù)值2) 最大值
pow(數(shù)值1,數(shù)值2) 數(shù)值1的數(shù)值2次方
random() 0倒1的隨機(jī)數(shù)
round(數(shù)值) 最接近該數(shù)值的整數(shù)
sqrt(數(shù)值) 開平方根
abs,、sin(弧度),、cos、tan,、asin,、acos、atan,、exp,、log

　　例1：
<Script>
with (document) {
    write("<LI>2 的平方根值是 ", Math.sqrt(2));
    write("<LI>2 <sup>3</sup> = ", Math.pow(2,3));
    write("<LI>最接近 3.14 的整數(shù)是 ", Math.round(3.14));
}

</Script>

　　例2：
<Script>
var now = new Date();
var firstDay = new Date("Nov 10, 1999");
var duration = now - firstDay;
var msPerDay = 24 * 60 * 60 * 1000; //換算成毫秒
days = Math.round(duration/msPerDay);

document.write("本網(wǎng)站已經(jīng)開幕" + days + "天了");

</Script>

例3：
<Script>

var promote = new Array(3);
promote[0] = "拍賣區(qū)又有新貨到了，趕快來撿便宜啊......"
promote[1] = "成為會員,，馬上享受八折優(yōu)惠,，還可以參加抽獎,！";
promote[2] = "慶祝訪問人數(shù)突破十萬人次，填問卷就送大獎,，快來?。?quot;;

index = Math.floor(Math.random() * promote.length);
document.write(promote[index]);

</Script>

數(shù)值對象,；
函數(shù)對象,；

自定義對象。

自定義對象,；
構(gòu)造函數(shù)定義對象類型,；
建立對象實(shí)例。
例：
<Script>
function member(name, sex) {
this.name = name;
this.sex = sex;
}

var papa = new member("楊宏文", "男生");
var mama = new member("黃雅玲", "女生");
var doggy = new member("奇　奇", "寵物狗");

document.write(papa.name);
document.write("是", papa.sex);

</Script>

動態(tài)的定義對象屬性,；
例：
為指定的對象實(shí)例定義屬性：papa.hobby="看電視";
為對象定義屬性：member.prototype.hobby=null;
　　　　　　　　papa.hobby="上網(wǎng)";
　　　　　　　　mama.hobby="逛街";
　　　　　　　　doggy.hobby="啃骨頭";

定義對象的方法,；
構(gòu)造函數(shù)定義對象方法名；
建立方法的描述函數(shù),。
例：
<Script>
function member(name, sex) {
this.name = name;
this.sex = sex;
this.display = display;
}

function display() {
var str = this.name + "是" + this.sex;
document.write("<LI>" + str);
}

var papa = new member("楊宏文", "男生");
var mama = new member("黃雅玲", "女生");
var doggy = new member("奇　奇", "寵物狗");

papa.display();
mama.display();
doggy.display();

</Script>

利用對象原型（prototype）為默認(rèn)對象定義屬性：

<Script>
String.prototype.replaceAll = strReplace;
function strReplace(findText, replaceText) {
var str = new String(this);
while (str.indexOf(findText)!=-1) {
str = str.replace(findText, replaceText);
}
return str;
}

myStr = "告訴你－如果你正在尋找一本能幫助你徹底研究" +
"JavaScript的書籍,，請你一定要認(rèn)明碁峰的" +
"JavaScript教學(xué)范本，讓你事半功倍,，功力大增,。";
document.write("<LI>原稿是：<BLOCKQUOTE>" + myStr +"</BLOCKQUOTE>");
document.write("<LI>利用Replace()將「你」改成「您」："
+"<BLOCKQUOTE>" + myStr.replace('你','您') +"</BLOCKQUOTE>");
document.write("<LI>利用自定義的字符串方法 - 全部取代"
+"<BLOCKQUOTE>" + myStr.replaceAll('你','您') +"</BLOCKQUOTE>");

</Script>

默認(rèn)函數(shù)：
編碼函數(shù) escape()：將非字母、數(shù)字字符轉(zhuǎn)換成ASCII碼

例：sample/unescape

譯碼函數(shù) unescape()：將ASCII碼轉(zhuǎn)換成字母,、數(shù)字字符

例：sample/unescape

求值函數(shù) eval()：

格式：eval(<表達(dá)式>)

例1：字符串運(yùn)算
<Script>
x = 1 + 2;
y = "1 + 2";
z = eval("1 + 2");

document.write("<LI>1 + 2 = ", x);
document.write("<LI>\"1 + 2\" = ", y);
document.write("<LI>eval(\"1 + 2\") = ", z);

</Script>

例2：對象操作
<Script>

function show(obj){
var str=eval("document.form."+obj+".value");
alert(str);
}
</Script>

數(shù)值判斷函數(shù) isNaN()：是否為數(shù)值

格式：isNaN(<量>)

例：
<Script>
var x = 15;
var y = "黃雅玲";

document.write("<LI>x 不是數(shù)值嗎,？",isNaN(x));
document.write("<LI>y 不是數(shù)值嗎？",isNaN(y));

</Script>

整數(shù)轉(zhuǎn)換函數(shù) parseInt()：將不同進(jìn)制（二,、八,、十六）的數(shù)值轉(zhuǎn)換成十進(jìn)制整數(shù)

格式：parseInt(數(shù)值字串[，底數(shù)])
底數(shù)省略,，則按內(nèi)容轉(zhuǎn)換：
　　　　　0x　0X　　十六進(jìn)制　　
　　　　　0　　八進(jìn)制
　　　　　其它　　十進(jìn)制

例：
<Script>
// 二進(jìn)位轉(zhuǎn)成十進(jìn)位

document.write("1101<sub>2</sub> = " ,parseInt("1101", 2),"<sub>10</sub><br>");

// 十六進(jìn)位轉(zhuǎn)成十進(jìn)位

document.write("BFFF<sub>16</sub> = " ,parseInt("BFFF", 16),"<sub>10</sub><br>");

</Script>

浮點(diǎn)數(shù)轉(zhuǎn)換函數(shù) parseFloat()：將數(shù)值字串轉(zhuǎn)換成浮點(diǎn)數(shù)

格式：parseFloat (數(shù)值字串)

例：
<Script>
document.write(parseInt("3.1234A56"), "<br>");
document.write(parseFloat("3.1234A56"), "<br>");

</Script>

函數(shù)：
獨(dú)立于主程序的,、具有特定功能的一段程序代碼塊。

函數(shù)的定義：
格式：
function 函數(shù)名([參數(shù)[,參數(shù)...]]){
<語句組>
[return <表達(dá)式>,；]
}

約定：
1,、函數(shù)名：易于識別；（同變量命名規(guī)則）
2,、程序代碼：模塊化設(shè)計,；
3、函數(shù)位置：按邏輯順序,，集中置頂,。（<head>...</head>）

return語句：
格式：
return <表達(dá)式>；

功能：返回表達(dá)式的值,。

函數(shù)的調(diào)用：
格式：
函數(shù)名([參數(shù)[,參數(shù)...]])

例1：
<Script>

function showName(name){
document.write ( "我是" + name );
}

showName("黃雅玲");

</Script>

例2：
<Script>

function showName(name){
str="我是" + name;
return str;
}

document.write(showName("黃雅玲"));

</Script>

事件：
用戶對瀏覽器所做的特定的動作（操作）,，是實(shí)現(xiàn)交互操作的一種機(jī)制。

事件名稱適用對象意義說明
Abort image 終止當(dāng)圖形尚未完全加載前
Blur   失去焦點(diǎn)
Change t/pw/ta/select 改變
DragDrop window 拖曳
Error   img/win 錯誤加載文件或圖形時發(fā)生錯誤
Focus   取得焦點(diǎn)
Move window 移動
Reset form 重置
Submit form
Click/DblClick,、KeyDown/KeyPress/KeyUp,、Load/Unload、MouseDown/MouseUp/MouseOver/MouseOut/MouseMove

事件處理程序：
瀏覽器響應(yīng)某個事件,，實(shí)現(xiàn)用戶的交互操作而進(jìn)行的處理（過程）,。

事件處理程序的調(diào)用：
瀏覽器等待用戶的交互操作，并在事件發(fā)生時,，自動調(diào)用事件處理程序（函數(shù)）,，完成事件處理過程。

HTML標(biāo)簽屬性：

格式：
<tag on事件=“<語句組>|<函數(shù)名>”>

例1：
<body onload="alert('建議瀏覽器的分辨率：800x600');">
<body onload="var str='建議瀏覽器的分辨率：800x600';alert(str);">

例2：
<script>
function show(){
var str="建議瀏覽器的分辨率：800x600";
alert(str);
}
</script>
<body onload="show();">

對象屬性：

格式：
對象名.on事件=<語句>|<函數(shù)名>

例1：
document.onload=alert("建議瀏覽器的分辨率：800x600");

var str="建議瀏覽器的分辨率：800x600";
document.onload=alert(str);

例2：
<script>
function show(){
var str="建議瀏覽器的分辨率：800x600";
alert(str);
}
document.onload=show();
</script>

例1：
<Body>
<FORM>
請輸入基本資料：<BR>
姓名：
<INPUT TYPE="text" NAME="usr" SIZE="8">
<INPUT TYPE="button" VALUE=" 請單擊" onClick="alert('謝謝你的填寫...')">
</Body>

例2：
<Script>
function handelError(img){
msg = "有一圖文件,，名為： \'" + img.name + "\'\n無法順利顯示,，請通知系統(tǒng)管理人員" + "，敬備薄禮相送,。";
alert(msg);
}
</Script>

例3：
<Body>
<A HREF="http://www./" onMouseOver="status='最棒的學(xué)習(xí)網(wǎng)站';return true;" onMouseOut="status='完畢'">文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)</A>
</Body>

例4：
<Body>
<FONT STYLE="cursor:hand" onClick="location='http://www./'" onMouseOver="status='最棒的在線學(xué)習(xí)網(wǎng)站'; this.color='red';return true;" onMouseOut="status='完畢'; this.color='blue';">文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)</FONT>
</Body>

例5：
<Script>
function mOver(object,msg){
   status = msg;
   object.color = "red";
   object.face = "華文楷體";
}

function mOut(object){
   status = '完畢';
   object.color = "blue";
   object.face = "幼圓";
}
</Script>

例6：
<STYLE> A {text-decoration:none} </STYLE>

例7：
<Script>

var url = new Array(3);
url[0] = "http://www./";
url[1] = "http://www./";
url[2] = "http://chinese.yahoo.com/";

function goto(i) {
location = url[i];
}

</Script>

定時器：（延遲器）
用以指定在一段特定的時間后執(zhí)行某段程序,。

setTimeout()：（1.0版）
格式：

[定時器對象名=] setTimeout(“<表達(dá)式>”，毫秒)

功能：執(zhí)行<表達(dá)式>一次,。

例1：
<Script>

function count() {
setTimeout("alert('三秒到了')",3000)
}

</Script>

例2：
<Script>

function show() {
document.all['news'].style.display = "";
setTimeout("hide()",500);
}

function hide() {
document.all['news'].style.display = "none";
setTimeout("show()",500);
}

</Script>

clearTimeout()：終止定時器
格式：

clearTimeout(定時器對象名)

setInterval()：（1.2版）
格式：

[定時器對象名=] setInterval(“<表達(dá)式>”,，毫秒)

功能：重復(fù)執(zhí)行<表達(dá)式>，直至窗口,、框架被關(guān)閉或執(zhí)行clearInterval,。

clearInterval()：終止定時器
格式：

clearInterval(定時器對象名)

例1：
<Script>

var sec = 0;
timerID = setInterval("count()",1000);

function count() {
num.innerHTML = sec++;
}

</Script>

停留時間：
<FONT ID="num" FACE="impact">0</FONT>秒鐘
<INPUT TYPE="button" VALUE="停止" onClick="clearInterval(timerID)">

例2：
<Script>

var str = "這是一個在線拍賣的網(wǎng)站，請盡情血拼吧,！";
var seq = 0;

function scroll() {
    msg = str.substring(0, seq+1);
    banner.innerHTML = msg;
    seq++;
    if (seq >= str.length) seq = 0;
}

</Script>

圖像對象：
網(wǎng)頁中的圖像均會被自動看作圖像對象,，并依順序，分別表示為document.images[0],，document.images[1]...

建立圖像對象：
格式：

圖像對象名稱=new Image([寬度],[高度])　　　//px

圖像對象的屬性：
border complete height hspace lowsrc name src vspace width

圖像對象的事件：
onAbort onError onKeyDown onKeyPress onKeyUop onLoad

例1：（預(yù)載）
<Script>

img0 = new Image();
img0.src = "images/snow0.gif";

img1 = new Image();
img1.src = "images/snow1.gif";

document.write ("已經(jīng)讀取兩個圖文件,，但此時不顯示。");

</Script>

例2：
<Script>
function img-preload(idx){
eval("img"+idx+" = new Image()");
eval("img"+idx+".src = 'images/snow"+idx+".gif'");
}

img-preload(0);
img-preload(1);
document.write ("已經(jīng)讀取兩個圖文件,，但此時不顯示,。");

</Script>

例3：
<Script>
function img-preload(imgname,idx){
eval("img"+idx+" = new Image()");
eval("img"+idx+".src = 'images/"+imgname+".gif'");
}

img-preload("snow0",0);
img-preload("snow1",1);
document.write ("已經(jīng)讀取兩個圖文件，但此時不顯示,。");

</Script>

Navigator對象：（領(lǐng)航員）
檢測瀏覽器的版本,、所支持的MIME類型、已安裝的外掛程序（plug-in）,。該對象包含兩個子對象：外掛對象,、MIME類型對象。

Navigator對象的屬性：

格式： navigator.屬性
appCodeName 代碼
appName 名稱
appVersion 版本
language 語言
mimeType 以數(shù)組表示所支持的MIME類型
platform 編譯瀏覽器的機(jī)器類型
plugins 以數(shù)組表示已安裝的外掛程序
userAgent 用戶代理程序的表頭

例1：
<Script>

with (document) {
    write ("你的瀏覽器信息：<OL>");
    write ("<LI>代碼："+navigator.appCodeName);
    write ("<LI>名稱："+navigator.appName);
    write ("<LI>版本："+navigator.appVersion);
    write ("<LI>語言："+navigator.language);
    write ("<LI>編譯平臺："+navigator.platform);
    write ("<LI>用戶表頭："+navigator.userAgent);
}

</Script>

例2：
<Script>

if (document.all) {
   document.write("你的瀏覽器是：MSIE");
}   else {
   document.write("你的瀏覽器是：Navigator");
}

</Script>

plugin對象的屬性：

格式： navigator.plugins.屬性
description 外掛程序模塊的描述
filename 外掛程序模塊的文件名
length 外掛程序模塊的個數(shù)
name 外掛程序模塊的名稱

例：
<Script>

var len = navigator.plugins.length;
with (document) {
    write ("你的瀏覽器共支持" + len + "種plug-in：<BR>");
    write ("<TABLE BORDER>")
    write ("<CAPTION>PLUG-IN 清單</CAPTION>")
    write ("<TR><TH> <TH>名稱<TH>描述<TH>文件名")
    for (var i=0; i<len; i++)
        write("<TR><TD>" + i +
            "<TD>" + navigator.plugins[i].name +
            "<TD>" + navigator.plugins[i].description +
            "<TD>" + navigator.plugins[i].filename);
}

</Script>

mimeType對象的屬性：

格式：navigator.mimeTypes.屬性
description MIME類型的描述
enablePlugin 對應(yīng)到哪個外掛模塊
length MIME類型的數(shù)目
suffixes MIME類型的擴(kuò)展名
type MIME類型的名稱

例：
<Script>

var len = navigator.mimeTypes.length;
with (document) {
    write ("你的瀏覽器共支持" + len + "種MIME類型：");
    write ("<TABLE BORDER>")
    write ("<CAPTION>MIME type 清單</CAPTION>")
    write ("<TR><TH> <TH>名稱<TH>描述<TH>擴(kuò)展名<TH>附注")
   for (var i=0; i<len; i++) {
       write("<TR><TD>" + i +
           "<TD>" + navigator.mimeTypes[i].type +
           "<TD>" + navigator.mimeTypes[i].description +
           "<TD>" + navigator.mimeTypes[i].suffixes +
           "<TD>" +
          navigator.mimeTypes[i].enabledPlugin.name);
}
}

</Script>

窗口對象的屬性和方法：
格式：

[window.]屬性
[window.]方法（參數(shù)）

opener.屬性
opener.方法（參數(shù)）
self.屬性
self.方法（參數(shù)）
parent.屬性
parent.方法（參數(shù)）
top.屬性
top.方法（參數(shù)）

窗口名稱.屬性
窗口名稱.方法（參數(shù)）

窗口對象的屬性：
document 當(dāng)前文件的信息
location 當(dāng)前URL的信息
name 窗口名稱
status 狀態(tài)欄的臨時信息
defaultStatus 狀態(tài)欄默認(rèn)信息
history 該窗口最近查閱過的網(wǎng)頁
closed 判斷窗口是否關(guān)閉，返回布爾值
opner open方法打開的窗口的源窗口
outerHeight 窗口邊界的垂直尺寸,，px
outerWidth 窗口邊界的水平尺寸,，px
pageXOffset 網(wǎng)頁x-position的位置
pageYOffset 網(wǎng)頁y-position的位置
innerHeight 窗口內(nèi)容區(qū)的垂直尺寸，px
innerWidth 窗口內(nèi)容區(qū)的水平尺寸,，px
screenX 窗口左邊界的X坐標(biāo)
screenY 窗口上邊界的Y坐標(biāo)
self 當(dāng)前窗口
top 最上方的窗口
parent 當(dāng)前窗口或框架的框架組
frames 對應(yīng)到窗口中的框架
length 框架的個數(shù)
locationbar 瀏覽器地址欄
menubar 瀏覽器菜單欄
scrollbars 瀏覽器滾動條
statusbar 瀏覽器狀態(tài)欄
toolbar 瀏覽器工具欄
offscreenBuffering 是否更新窗口外的區(qū)域
personalbars 瀏覽器的個人工具欄,，僅Navigator

窗口對象的方法：
alert(信息字串) 彈出警告信息
confirm(信息字串) 顯示確認(rèn)信息對話框
prompt(提示字串[，默認(rèn)值]) 顯示提示信息,，并提供可輸入的字段
atob(譯碼字串) 對base-64編碼字串進(jìn)行譯碼
btoa(字串) 將進(jìn)行base-64編碼
back() 回到歷史記錄的上一網(wǎng)頁
forward() 加載歷史記錄中的下一網(wǎng)頁
open(URL,，窗口名稱[，窗口規(guī)格])
focus() 焦點(diǎn)移到該窗口
blur() 窗口轉(zhuǎn)成背景
stop() 停止加載網(wǎng)頁
close()
enableExternalCapture() 允許有框架的窗口獲取事件
disableExternalCapture() 關(guān)閉enableExternalCapture()
captureEvents(事件類型) 捕捉窗口的特定事件
routeEvent(事件) 傳送已捕捉的事件
handleEvent(事件) 使特定事件的處理生效
releaseEvents(事件類型) 釋放已獲取的事件
moveBy(水平點(diǎn)數(shù),，垂直點(diǎn)數(shù)) 相對定位
moveTo(x坐標(biāo),，y坐標(biāo)) 絕對定位
setResizable(true|false) 是否允許調(diào)整窗口大小
resizeBy(水平點(diǎn)數(shù)，垂直點(diǎn)數(shù)) 相對調(diào)整窗口大小
resizeTo(寬度,，高度) 絕對調(diào)整窗口大小
scroll(x坐標(biāo),，y坐標(biāo)) 絕對滾動窗口
scrollBy(水平點(diǎn)數(shù)，垂直點(diǎn)數(shù)) 相對滾動窗口
scrollTo(x坐標(biāo),，y坐標(biāo)) 絕對滾動窗口
setInterval(表達(dá)式,，毫秒)
setTimeout(表達(dá)式，毫秒)
clearInterval(定時器對象)
clearTimeout(定時器對象)
home() 進(jìn)入瀏覽器設(shè)置的主頁
find([字串[,caseSensitivr,backward]]) 查找窗口中特定的字串
print()
setHotKeys(true|false) 激活或關(guān)閉組合鍵
setZOptions() 設(shè)置窗口重疊時的堆棧順序

窗口對象的事件處理程序：
onBlur onDragDrop onError onFocus onLoad onMove onResize onUnload

例1：
<Script>

function checkPassword(testObject) {
if (testObject.value.length < 4) {
    alert("密碼長度不得小于四");
    testObject.focus();
    testObject.select();
}
}

</Script>

請輸入密碼：
<INPUT TYPE="text" onBlur="checkPassword(this)">

例2：
<Script>

if (confirm("你滿十八歲了嗎?"))
location = "adult.htm";
else
alert("等你成年以後再來吧!");

</Script>

例3：
<Script>

var bgColor =
prompt("你喜歡哪一種底色：\n淺藍(lán)色請按1,，粉紅色請按2",1)

if (bgColor == 1) document.bgColor = "#CCFFFF";
else if (bgColor == 2) document.bgColor = "#FFCCFF";
else document.bgColor = "#FFFFFF";

</Script>

例4：
<Script>
function grow() {
resizeBy(0, 50);
}

function shrink() {
resizeBy(0, -50);
}

</Script>

<Body onMouseOver="grow()" onMouseOut="shrink()">
將視窗放大與縮小
</Body>

例5：
<Script>

function scrollIt() {
for (y=1; y<=2000; y++) {
scrollTo(1,y);
}
}

</Script>

<Body onDblClick=scrollIt()>
雙擊鼠標(biāo),，畫面會自動卷動...
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
... The End ...
</Body>

open方法的窗口規(guī)格參數(shù)：（yes/no，1/0）
格式：[var 新窗口對象名=]window.open("url","windowName","windowFeature")

alwaysLowered 是否將窗口顯示的堆棧后推一層
alwaysRaised 是否將窗口顯示的堆棧上推一層
dependent 是否將該窗口與當(dāng)前窗口產(chǎn)生依存關(guān)系
fullscreen 是否滿屏顯示
directories 是否顯示連接工具欄
location 是否顯示網(wǎng)址工具欄
menubar 是否顯示菜單工具欄
scrollbars 是否顯示滾動條
status 是否顯示狀態(tài)欄
titlebar 是否顯示標(biāo)題欄
toolbar 是否顯示標(biāo)準(zhǔn)工具欄
resizable 是否可以改變窗口的大小
screenX 窗口左邊界距離
screenY 窗口上邊界距離
top 窗口上邊界
width 窗口寬度
height 窗口高度
left 窗口左邊界
outerHeight 窗口外邊界的高度
personalbar 是否顯示個人工具欄

注釋：open("","","menubar")
open("","","menubar=1")
open("","","menubar=yes")

例1：
<Script>

document.write ("文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)");
open ('1.htm','','height=100,width=300');

</Script>

<TITLE>歡迎光臨</TITLE>

<IMG SRC="images\welcome.gif" ALIGN="left">
<CENTER>
<FONT COLOR="blue" SIZE="5">歡迎光臨</FONT><BR>
這是一個技術(shù)研習(xí)的小天地<BR>
</CENTER>

</BODY>

例2：
<Script>

document.write("文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)")
helloWin = open ('1.htm','','height=100,width=300');

var line1 = "<FONT COLOR='blue' SIZE='5'>歡迎光臨</FONT><BR>"
var line2 = "這是一個技術(shù)研習(xí)的小天地"
helloWin.document.write (line1 + line2)
helloWin.document.title = "歡迎光臨"

</Script>

例3：
<Script>

window.defaultStatus = "最棒的線上學(xué)習(xí)網(wǎng)站";

</Script>

例4：
<Script>

queryWin = open('1.htm','','height=100,')

</Script>

利用子窗口來改變母窗口的底色

/* -------- 1.htm -------- */
<Script>

function passToOpener(color) {
opener.document.bgColor = color;
self.close();
}

</Script>
<CENTER>

請選擇你喜歡的顏色?<BR>

</CENTER>

屏幕對象：
描述屏幕的顯示及顏色屬性,。

屏幕對象的屬性：

格式： screen.屬性
availHeight 屏幕區(qū)域的可用高度
availWidth 屏幕區(qū)域的可用寬度
colorDepth 顏色深度 256/8 16/16 32M/32
height 屏幕區(qū)域的實(shí)際高度
width 屏幕區(qū)域的實(shí)際寬度

例1：
<Script>

with (document) {
    write ("您的屏幕顯示設(shè)定值如下：<P>");
    write ("屏幕的實(shí)際高度為", screen.availHeight, "<BR>");
    write ("屏幕的實(shí)際寬度為", screen.availWidth, "<BR>");
    write ("屏幕的色盤深度為", screen.colorDepth, "<BR>");
    write ("屏幕區(qū)域的高度為", screen.height, "<BR>");
    write ("屏幕區(qū)域的寬度為", screen.width);
}

</Script>

例2：
<Script>

if ( screen.width < 800 || screen.colorDepth < 8 ){
var msg = "本網(wǎng)站最佳瀏覽模式為 800 * 600 * 256";
alert(msg);
}

</Script>

事件對象：

當(dāng)事件發(fā)生時，瀏覽器自動建立該對象,，并包含該事件的類型,、鼠標(biāo)坐標(biāo)等。
事件對象的屬性：

格式：event.屬性
data 返回拖拽對象的URL字符串（dragDrop）
width 該窗口或框架的高度
height 該窗口或框架的高度
pageX 光標(biāo)相對于該網(wǎng)頁的水平位置
pageY 光標(biāo)相對于該網(wǎng)頁的垂直位置
screenX 光標(biāo)相對于該屏幕的水平位置
screenY 光標(biāo)相對于該屏幕的垂直位置
target 該事件被傳送到的對象
type 事件的類型
which 數(shù)值表示的鍵盤或鼠標(biāo)鍵：1/2/3（左鍵/中鍵/右鍵）
layerX 光標(biāo)相對于事件發(fā)生層的水平位置
layerY 光標(biāo)相對于事件發(fā)生層的垂直位置
x 相當(dāng)于layerX
y 相當(dāng)于layerY

例1：
<Script>

function getEvent(evnt) {
eventWin = open ('','','width=200,height=100');
with (eventWin.document) {
     write("事件類型：", event.type);
     write("<br>鼠標(biāo)的x坐標(biāo)：", event.screenX);
     write("<br>鼠標(biāo)的y坐標(biāo)：", event.screenY);
}
}

document.write ("單擊...")
document.onmousedown = getEvent;
</Script>

例2：
<Script>

function getCoordinate(evnt) {

if (document.all) {
   x = event.screenX;
   y = event.screenY;
}
else {
   x = evnt.screenX;
   y = evnt.screenY;
}
status = "水平坐標(biāo)："+ x + ",；垂直坐標(biāo)："+ y;
}

document.onmousemove = getCoordinate;

</Script>

例3：
<Script>

function whichKey(evnt) {

if (document.all) {
    x = event.button;
    if( x==1 ) alert("你單擊了左鍵");
    if( x==2 ) alert("你單擊了右鍵");
}

else {
    x = evnt.button;
    if( x==1 ) alert("你單擊了左鍵");
    if( x==3 ) alert("你單擊了右鍵");
    return false;
}
}

document.onmousedown = whichKey;
document.write("請單擊鼠標(biāo)左/右鍵");

</Script>

歷史對象：

用以存儲客戶端最近訪問的網(wǎng)址清單,。
格式：

history.屬性
history.方法（參數(shù)）

歷史對象的屬性：

current 當(dāng)前歷史記錄的網(wǎng)址
length 存儲在記錄清單中的網(wǎng)址數(shù)目
next 下一個歷史記錄的網(wǎng)址
previous 上一個歷史記錄的網(wǎng)址

歷史對象的方法：

back() 回到上一個歷史記錄中的網(wǎng)址
forward() 回到下一個歷史記錄中的網(wǎng)址
go(整數(shù)或URL) 前往歷史記錄中的網(wǎng)址

例1：
history.go(-1)

newWin.history.back()

parent.downFrame.histroy.back()

例2：
<A HREF="#" onClick="history.back()">上一頁</A>

位置對象：
用來代表特定窗口的URL信息。

格式：

location.屬性
location.方法（參數(shù)）

URL的格式：

protocol//host:port/path#hash?search

URL的種類：

javascript: javascript程序代碼
view-source: 顯示源代碼
http:
file:
ftp:
mailto:
news:
gopher

位置對象的屬性：

hash 錨點(diǎn)名稱
host 主機(jī)名稱
hostname host:port
href 完整的URL字符串
pathname 路徑
port 端口
protocol 協(xié)議
search 查詢信息

位置對象的方法：

reload() 重新加載
replace(網(wǎng)址) 用指定的網(wǎng)頁取代當(dāng)前網(wǎng)頁

例1：

按下按鈕前往「文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)」<P>
<INPUT TYPE="button" VALUE="走吧,！" onClick="location.href='http://www./'">

例2：

例3：
<Script>

var sec = 5;

function countDown() {
if (sec > 0) {
num.innerHTML = sec--;
}
else
location = "http://www./";
}
</Script>

<BODY onLoad="setInterval('countDown()', 1000)">
<CENTER>
文哥網(wǎng)絡(luò)技術(shù)學(xué)習(xí)網(wǎng)
<H2>http://www./</H2>
五秒鐘后自動帶你前往<BR>
<FONT ID="num" SIZE="7" FACE="impact">5</FONT>

例4：

文件對象：
代表當(dāng)前HTML對象,，是由<body>標(biāo)簽組構(gòu)成的，對每個HTML文件會自動建立一個文件對象,。

格式：

document.屬性
document.方法（參數(shù)）

文件對象的屬性：

linkColor 設(shè)置超鏈接的顏色
alinkColor 作用中的超鏈接的顏色
vlinkColor 鏈接的超鏈接顏色
links 以數(shù)組索引值表示所有超鏈接
URL 該文件的網(wǎng)址
anchors 以數(shù)組索引值表示所有錨點(diǎn)
bgColor 背景顏色
fgColor 前景顏色
classes 文件中的class屬性
cookie 設(shè)置cookie
domain 指定服務(wù)器的域名
formName 以表單名稱表示所有表單
forms 以數(shù)組索引值表示所有表單
images 以數(shù)組索引值表示所有圖像
layers 以數(shù)組索引值表示所有l(wèi)ayer
embeds 文件中的plug-in
applets 以數(shù)組索引值表示所有applet
plugins 以數(shù)組索引值表示所有插件程序
referrer 代表當(dāng)前打開文件的網(wǎng)頁的網(wǎng)址
tags 指出HTML標(biāo)簽的樣式
title 該文檔的標(biāo)題
width 該文件的寬度（px）
lastModified 文件最后修改時間

文件對象的方法：

captureEvents(事件) 設(shè)置要獲取指定的事件
close() 關(guān)閉輸出字符流,，強(qiáng)制顯示數(shù)據(jù)內(nèi)容
getSelection() 取得當(dāng)前選取的字串
handleEvent(事件) 使事件處理器生效
open([mimeType,[replace]]) 打開字符流
releaseEvents(事件類型) 釋放已獲取的事件
routeEvent(事件) 傳送已捕捉的事件
write(字串) 寫字串或數(shù)值到文件中
writeln(字串) 分行寫字串或數(shù)值到文件中（<pre>..</pre>）

文件對象的事件處理程序：
onClick onDbClick onKeyDown onKeyPress onKeyUp onMouseDown onMouseOver

例1：
<Script>

document.bgColor = "white";
document.fgColor = "black";
document.linkColor = "red";
document.alinkColor = "blue";
document.vlinkColor = "purple";

</Script>

測試文件對象的顏色屬性：<BR>

例2：
<Script>

var update_date = document.lastModified;
var formated_date = update_date.substring(0,10);

document.write("本網(wǎng)頁更新日期：" + update_date + "<BR>")
document.write("本網(wǎng)頁更新日期：" + formated_date)

</Script>

錨點(diǎn)對象：
網(wǎng)頁中的錨點(diǎn)均會被自動看作錨點(diǎn)對象，并依順序,，分別表示為document.anchors[0],，document.anchors[1]...

定義錨點(diǎn)對象的格式：

字串.anchor(屬性)

錨點(diǎn)對象的屬性：

name 錨點(diǎn)名稱
text 錨點(diǎn)字串

鏈接對象：
網(wǎng)頁中的鏈接均會被自動看作鏈接對象，并依順序，分別表示為document.links[0],，document.links[1]...

定義鏈接對象的格式：

字串.link(屬性)

鏈接對象的屬性：

hash URL中的錨點(diǎn)名稱
host 主機(jī)域名或IP地址
hostname URL中的host+port
href 完整的URL字串
pathname URL中path部分
port URL中端口部分
protocol URL中通訊協(xié)議部分
search URL中查詢字串部分
target 代表目標(biāo)的窗口
text 表示A標(biāo)簽中的文字
x 鏈接對象的左邊界
y 鏈接對象的右邊界

鏈接對象的方法：
handleEvent(事件)
激活對某事件的處理程序。

鏈接對象的事件處理程序：
onClick onDbClick onKeyDown onKeyPress onKeyUp onMouseDown onMouseUp onMouseOver onMouseOut

例1：
<Script>

function linkGetter() {
msgWindow = open('','','width=250,height=200')
msgWindow.document.write("共有" + document.links.length + "個搜索引擎")
for (var i = 0; i < document.links.length; i++) {
msgWindow.document.write("<LI>"+document.links[i])
}
}

</Script>

常用的搜索引擎：<BR>

框架對象：
可以被窗口中的框架引用的對象,，具有窗口對象的屬性和方法,。

格式：

top.frameName|frames[n].屬性|方法

parent.frameName|frames[n].屬性|方法

例：
/* -------- frameset.htm -------- */
<Script>

document.title = "框架組頁";
var usrID = "來賓";

</Script>

<HEAD>
<TITLE>導(dǎo)航頁</TITLE>
<STYLE>A{text-decoration:none}</STYLE>
</HEAD>
<BODY>
<CENTER>
<A HREF="login.htm" TARGET="downFrame">會員登錄</A><BR>
<A HREF="hot.htm" TARGET="downFrame">熱門優(yōu)惠</A><BR>
<A HREF="welcome.htm" TARGET="downFrame">回首頁</A>
<BR>
</CENTER>
</BODY>

/* -------- usrInfo.htm -------- */
<Script>

document.title = "用戶信息";
var bye = "歡迎有空常來..."

document.write
("<MARQUEE>親愛的<FONT COLOR='gray'><U>",top.usrID,"</U></FONT>會員,，歡迎您的光臨,！</MARQUEE>");

</Script>

/* -------- login.htm -------- */
<Script>

document.title = "用戶登錄";

function login() {
top.usrID = document.loginForm.usr.value;
top.upFrame.location = "usrInfo.htm";
}

</Script>

<HTML>
<FORM NAME="loginForm">
請輸入您的大名：
<INPUT TYPE="text" NAME="usr">
<INPUT TYPE="button" VALUE="填寫完畢" onClick=login()>
</FORM>
</HTML>

防止直接鏈接：
例：
<Script> /* -------- hot.htm -------- */

document.title = "熱門優(yōu)惠";

if (top.usrID == null) {
location = "frameset.htm";
}

</Script>

今日優(yōu)惠：

<LI>超級豪華大比薩,。（原價$550，今天只要$450）
<LI>海鮮大比薩,。（原價$550，今天只要$450）

檢查是否使用框架：
例：

<HEAD>
<TITLE>首頁</TITLE>
<STYLE>A{text-decoration:none}</STYLE>

if (top.frames.length == 0) {
location = "frameset.htm";
}
if (top.frames.length > 0) {
location = "frameset.htm";
}

</Script>

</HEAD>
<CENTER>
歡迎光臨<H1>
<FONT COLOR="green" FACE="arial">
My PIZZA</FONT></H1>
</CENTER>

表單對象：
文件對象的子對象，Javascript的runtime engine自動為每一個表單建立一個表單對象,。

格式：

document.forms[索引].屬性

document.forms[索引].方法（參數(shù)）

document.表單名稱.屬性

document.表單名稱.方法（參數(shù)）

表單對象的屬性：
action 表單動作
elements 以索引表示的所有表單元素
encoding MIME的類型
length 表單元素的個數(shù)
method 方法
name 表單名稱
target 目標(biāo)

表單對象的方法：
handleEvent(事件) 使事件處理程序生效
reset() 重置
submit() 提交

文本對象：

格式：
document.forms[索引].elements[索引].屬性

document.forms[索引].elements[索引].方法（參數(shù)）

document.表單名稱.文本對象名稱.屬性

document.表單名稱.文本對象名稱.方法（參數(shù)）

屬性：
defaultValue 該對象的value屬性
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
focus()
handleEvent(事件)
select() 該對象設(shè)置為選取狀態(tài)

事件處理程序：
onBlur onChange onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove onSelect

例1：
<FORM>
姓名：
<INPUT TYPE="text" NAME="name">
<INPUT TYPE="button" VALUE="請單擊" onClick=alert("謝謝你,，"+this.form.name.value)>
</FORM>

例2：
<Script>

function getFocus(obj) {
    obj.style.color='red';
    obj.style.background='#DBDBDB';
}
function getBlur(obj) {
    obj.style.color='black';
    obj.style.background='white';
}

</Script>

例3：
<Script>

var i = 0;

function movenext(obj,i) {
if(obj.value.length==4){
document.forms[0].elements[i+1].focus();
}
}

function result() {
fm = document.forms[0];
num = fm.elements[0].value +
fm.elements[1].value +
fm.elements[2].value +
fm.elements[3].value ;
alert("你輸入的信用卡號碼是"+ num);
}

</Script>

<BODY onLoad=document.forms[0].elements[i].focus()>
請輸入你的信用卡號碼：
<form>
<input type=text size=3 maxlength=4 onKeyup=movenext(this,0)> -
<input type=text size=3 maxlength=4 onKeyup=movenext(this,1)> -
<input type=text size=3 maxlength=4 onKeyup=movenext(this,2)> -
<input type=text size=3 maxlength=4 onKeyup=movenext(this,3)>
<input type=button value=顯示 onClick=result()>
</form>
</BODY>

密碼對象：
格式：
document.forms[索引].elements[索引].屬性

document.forms[索引].elements[索引].方法（參數(shù)）

document.表單名稱.密碼對象名稱.屬性

document.表單名稱.密碼對象名稱.方法（參數(shù)）

屬性：
defaultValue 該對象的value屬性
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
focus()
handleEvent(事件)
select() 該對象設(shè)置為選取狀態(tài)

事件處理程序：
onBlur onChange onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove onSelect

例1：
<Script>

function checkPw() {
fm = document.form1;
if (fm.pw2.value != fm.pw1.value) {
    alert("密碼不符,，請重新輸入");
    document.form1.pw2.select();
}
else
    alert("謝謝你,，"+fm.name.value);
}

</Script>

例2：
<Script>

<form action="test.asp" onSubmit="return isInt(this.pw.value)">
請輸入四位數(shù)數(shù)字密碼：<BR>
<input type="password" name="pw">
<input type="submit" value="檢查">
</form>

按鈕對象,、提交按鈕對象,、重置按鈕對象：

格式：
document.forms[索引].elements[索引].屬性

document.forms[索引].elements[索引].方法（參數(shù)）

document.表單名稱.按鈕對象名稱.屬性

document.表單名稱.按鈕對象名稱.方法（參數(shù)）

屬性：
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
click()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

隱藏對象：

格式：
document.forms[索引].elements[索引].屬性

document.forms[索引].elements[索引].方法（參數(shù)）

document.表單名稱.隱藏對象名稱.屬性

document.表單名稱.隱藏對象名稱.方法（參數(shù)）

屬性：
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

單選按鈕對象：

格式：
document.forms[索引].elements[索引](索引).屬性

document.forms[索引].elements[索引](索引).方法（參數(shù)）

document.表單名稱.單選對象名稱[索引].屬性

document.表單名稱.單選對象名稱[索引].方法（參數(shù)）

屬性：
checked 設(shè)置該對象為選定狀態(tài)
defaultChecked 對應(yīng)該對象的默認(rèn)選定狀態(tài)
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
click()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

例：
<Script>

function show() {
var x = "先生";
if (document.form1.sex[1].checked)
x = "小姐";
alert(document.form1.name.value + x);
}

</Script>
<FORM NAME=form1>
姓名：<INPUT TYPE="text" NAME="name"><BR>
你是：<INPUT TYPE="radio" NAME="sex" CHECKED>帥哥
<INPUT TYPE="radio" NAME="sex">美女<BR>
<INPUT TYPE="button" VALUE="請單擊" onClick=show()>
</FORM>

復(fù)選框?qū)ο螅?/p>

格式：
document.forms[索引].elements[索引].屬性

document.forms[索引].elements[索引].方法（參數(shù)）

document.表單名稱.單選對象名稱[索引].屬性

document.表單名稱.單選對象名稱[索引].方法（參數(shù)）

方法：
blur()
click()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

例：
<Script>

function count() {
var checkCount=0;
var num = document.form1.elements.length;

for (var i=0; i<num; i++) {
if (document.form1.elements[i].checked)
checkCount++;
}
alert ("你喜歡 "+ checkCount + "種顏色,。")
}

</Script>
<FORM NAME=form1>
請選擇你喜歡的顏色：<BR>
<INPUT TYPE="checkbox" NAME="red">紅色
<INPUT TYPE="checkbox" NAME="green">綠色
<INPUT TYPE="checkbox" NAME="blue">藍(lán)色<BR>
<INPUT TYPE="button" VALUE="請單擊" onClick=count()>
</FORM>

選擇對象：

屬性：
form 該對象所在的表單
name 該對象的name屬性
length 選項(xiàng)的數(shù)目
options <option>標(biāo)記
selectedIndex 所選項(xiàng)目的索引值
type 該對象的type屬性

方法：
blur()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onChange onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

選項(xiàng)對象：選擇對象的子對象

格式：
<option value="值" selected>文字</option>

new Option([文字[,值[,defaultSelected[,selected]]]])

屬性：
selected 判斷該選項(xiàng)是否被選取
defaultSelected 指定該選項(xiàng)為默認(rèn)選定狀態(tài)
index 所有選項(xiàng)所構(gòu)成的數(shù)組索引值
length 選項(xiàng)的數(shù)目
text 該選項(xiàng)顯示的文字
value 所選項(xiàng)傳到服務(wù)器的值

例1：
<Script>

var url = new Array(3);
url[0] = "http://www./";
url[1] = "http://www./";
url[2] = "http://chinese.yahoo.com/";

function goto(form) {
var i = form.menu.selectedIndex;
if (i>0) {
location = url[i-1];
}
}

</Script>
<FORM>
<SELECT NAME="menu" onChange="goto(this.form)">
<OPTION>你喜歡哪一個搜索引擎?
<OPTION STYLE="color:red">◆蕃薯藤
<OPTION STYLE="color:red">◇奇摩
<OPTION STYLE="color:red">◆中文雅虎
</SELECT>
</FORM>

例2：
<Script>

function getText() {
sel = document.forms[0].weekday
ans = sel.options[sel.selectedIndex].text
return ans;
}

</Script>
<FORM>請選擇...
<SELECT name=weekday>
<OPTION VALUE="Monday">星期一
<OPTION VALUE="Tuesday">星期二
<OPTION VALUE="Wednesday">星期三
<OPTION VALUE="Thursday">星期四
<OPTION VALUE="Friday">星期五
<OPTION VALUE="Saturday">星期六
<OPTION VALUE="Sunday">星期日
</SELECT><P>
<INPUT TYPE="button" VALUE="取出選項(xiàng)的文字"
onClick="alert(getText())">
<INPUT TYPE="button" VALUE="取出選項(xiàng)的值"
onClick="alert(this.form.weekday.value)"><BR>
</FORM>

例3：
<FORM NAME="form1">
你最喜歡哪一種水果?
<INPUT TYPE="text" NAME="fruit">
<A HREF="#" onClick="javascript:open('1.htm','','width=100')">
查詢</A>
</FORM>

<Script> /* -------- 1.htm -------- */

function choice() {
sel = document.forms[0].elements[0];
document.form1.fruit.value =
sel.options[sel.selectedIndex].text;
self.close();
}

</Script>

例4：
<Script>

function createOptions(){
var option = new Option(document.form1.select1.value)
document.form1.select2.options[2] = option;
}

</script>

<form name="form1">
<select name="select1" size="10">
<option>可選擇項(xiàng)目 <option>---------------
<option value="香蕉">香蕉 <option value="葡萄">葡萄
<option value="蘋果">蘋果 <option value="梨子">梨子
</select>

<input type="button" value="-->" onClick="createOptions()">
<select name="select2" size="10">
<option>選擇項(xiàng)目 <option>---------------
</select>
</form>

例5：
<Script>

function createOptions(){
sel1 = document.form1.select1;
sel2 = document.form1.select2;
var num = sel1.selectedIndex;
var option = new Option(sel1.options[num].text);
sel2.options[2] = option;
}

</script>

<input type="button" value="-->" onClick="createOptions()">
<select name="select2" size="10">
<option>選擇項(xiàng)目 <option>---------------
</select>
</form>

例6：
<Script>

function createOptions(){
sel1 = document.form1.select1;
sel2 = document.form1.select2;
var num = sel1.selectedIndex;
var option = new Option(sel1.options[num].text);
var item = sel2.options.length;
sel2.options[item] = option;
}

</script>

<select name="select1" size="10">
<option>可選擇項(xiàng)目 <option>---------------
<option value="香蕉">香蕉 <option value="葡萄">葡萄
<option value="蘋果">蘋果 <option value="梨子">梨子
</select>

<input type="button" value="-->" onClick="createOptions()">
<select name="select2" size="10">
<option>選擇項(xiàng)目 <option>---------------
</select>
</form>

例7：
<Script>

function createOptions(){

sel1 = document.form1.select1;
sel2 = document.form1.select2;
var num = sel1.selectedIndex;
if (num > 1) {
var option = new Option(sel1.options[num].text);
var item = sel2.options.length;
sel2.options[item] = option;
}
sel1.selectedIndex = 10000;
}

function delOptions() {
var num = document.form1.select2.selectedIndex;
if (num>1)
document.form1.select2.options[num] = null;
else
document.form1.select2.selectedIndex = 10000;
}

</script>
<form name="form1">
<select name="select1" size="10"
onDblClick="createOptions()">
<option>可選擇項(xiàng)目 <option>---------------
<option value="香蕉">香蕉 <option value="葡萄">葡萄
<option value="蘋果">蘋果 <option value="梨子">梨子
</select>
<input type="button" value="選擇" onClick="createOptions()">
<select name="select2" size="10">
<option>選擇項(xiàng)目 <option>---------------
</select>
<input type="button" value="刪除" onClick="delOptions()">
</form>

文本區(qū)域?qū)ο螅?/p>

屬性：
defaultValue 對應(yīng)該對象的默認(rèn)值
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
select()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onChange onSelect onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

例1：
<Script>

function isTooLong(elm){
if (elm.length > 50) {
alert("留言內(nèi)容太長，請修改后再發(fā)送....");
return false;
}
}

</script>

<FORM onSubmit="return isTooLong(this.msg.value)">
<TEXTAREA NAME="msg" COLS="30" ROWS="5" onFocus="this.value=''">
歡迎留言,，不過請長話短說....
</textarea><BR>
<INPUT TYPE="submit" VALUE="留言完畢">
</FORM>

例2：
<STYLE>
INPUT {background-color:'99FFFF';color:"red"}
TEXTAREA {background-color:'99FFFF';color:"red"}
</STYLE>
<BODY BGCOLOR="99FFFF">
<FORM METHOD="post" ENCTYPE="text/plain" ACTION="mailto:[email protected]?subject=不錯">
<TABLE>
<CAPTION>讀者回函</CAPTION>
<TR><TD>姓　　名：
<TD><INPUT TYPE="text" NAME="userName">
<TR><TD>電子郵件：
<TD><INPUT TYPE="text" NAME="email">
<TR><TD VALIGN="top">內(nèi)　　容：
<TD><TEXTAREA NAME="msg" ROWS="2" COLS="30">
我非常喜歡你的書,，加油!!!
</TEXTAREA>
<TR><TD COLSPAN="2" ALIGN="center">
<INPUT TYPE="submit" VALUE="填好了">
</TABLE>
</FORM>
</BODY>

文件上傳對象：

屬性：
form 該對象所在的表單
name 該對象的name屬性
type 該對象的type屬性
value 該對象的value屬性

方法：
blur()
select()
focus()
handleEvent(事件)

事件處理程序：
onBlur onClick onSelect onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

Cookie對象：
是一種以文件（Cookie文件）的形式保存在客戶端硬盤的Cookies文件夾中的用戶數(shù)據(jù)信息（Cookie數(shù)據(jù)）。Cookie文件由所訪問的Web站點(diǎn)建立,，以長久的保存客戶端與Web站點(diǎn)間的會話數(shù)據(jù),，并且該Cookie數(shù)據(jù)只允許被所訪問的Web站點(diǎn)進(jìn)行讀取,。

Cookie文件的格式：
NS：Cookie.txt
IE：用戶名@域名.txt

寫入Cookie：
格式：

document.cookie = " 關(guān)鍵字 = 值 [ ; expires = 有效日期 ] [;...]"

備注：

有效日期格式：Wdy,DD-Mon-YY HH:MM:SS GMT
Wdy / Mon：英文星期 / 月份；
還包含path,、domain,、secure屬性,；
每個Web站點(diǎn)（domain）可建立20個Cookie數(shù)據(jù),；
每個瀏覽器可存儲300個Cookie數(shù)據(jù),，4k字節(jié),；
客戶有權(quán)禁止Cookie數(shù)據(jù)的寫入,。

例1：

var today = new Date();
var expireDay = new Date();
var msPerMonth = 24*60*60*1000*31;
expireDay.setTime( today.getTime() + msPerMonth );

document.cookie = "name=Hubert;expires=" + expireDay.toGMTString();
document.write("已經(jīng)將 Cookie 寫入你的硬盤中了!<br>");
document.write("內(nèi)容是：", document.cookie, "<br>");
document.write("這個 Cookie 的有效時間是：");
document.write(expireDay.toGMTString());

</Script>

例2：

var today = new Date();
var expireDay = new Date();
var msPerMonth = 24*60*60*1000*31;
expireDay.setTime( today.getTime() + msPerMonth );

function setCookie(Key,value) {
document.cookie = Key + "=" + value + ";expires=" + expireDay.toGMTString();
}

setCookie("NAME","HUBERT");
document.write("累計的 Cookies 如下：<BR>");
document.write(document.cookie);

</Script>

讀取Cookie：
格式：

document.cookie

例

function getCookie(Key){
var search = Key + "=";
begin = document.cookie.indexOf(search);
if (begin != -1) {
begin += search.length;
end = document.cookie.indexOf(";",begin);
if (end == -1) end = document.cookie.length;
return document.cookie.substring(begin,end);
}
}

document.write("嗨,！ ",getCookie("name"), " 歡迎光臨..")

</Script>

刪除Cookie：
格式：

document.cookie = " 關(guān)鍵字 = ; expires = 當(dāng)前日期"

例：

var today = new Date();

function delCookie(Key) {
document.cookie = Key + "=;expires=today.toGMTString";
}

document.write("現(xiàn)有的 Cookies 如下：<BR>");
document.write(document.cookie, "<BR>");
delCookie("name");
document.write("刪除后的 Cookies 如下：<BR>");
document.write(document.cookie);

</Script>

本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間,，所有內(nèi)容均由用戶發(fā)布,，不代表本站觀點(diǎn)。請注意甄別內(nèi)容中的聯(lián)系方式,、誘導(dǎo)購買等信息,，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,，請點(diǎn)擊一鍵舉報,。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來自：悟靜 > 《JavaScript》

舉報/認(rèn)領(lǐng)