JavaScripting 生成文本如何在頁面中寫文本 <script type="text/javascript"> document.write("Hello World!") </script> 生成普通文本和標簽如何使用 JavaScript 在頁面中寫入普通文本和標簽。 <script ...

JavaScripting

生成文本

如何在頁面中寫文本

document.write("Hello World!")

</script>

生成普通文本和標簽

如何使用 JavaScript 在頁面中寫入普通文本和標簽。

document.write("<h1>Hello World!</h1>")

</script>

當頁面載入時，會執行位於 body 部分的 JavaScript。

當被調用時，位於 head 部分的 JavaScript 才會被執行。

head 部分 :調用函數前，腳本已經載入

function message()

{

alert("該提示框是通過 onload 事件調用的。")

}

</script>

</head>

<body onload="message()"> >>>>>>>>註意message的書寫

</body>

body 部分

<body>

document.write("該消息在頁面載入時輸出。")

</script>

</body>

外部 JavaScript

<body>

</script>

<p>

實際的腳本位於名為 "xxx.js" 的外部腳本中。

</p>

</body>

使用外部 JavaScript

有時，你也許希望在若幹個頁面中運行 JavaScript，同時不在每個頁面中寫相同的腳本

為了達到這個目的，你可以將 JavaScript 寫入一個外部文件之中。然後以 .js 為尾碼保存這個文件。

註意：外部文件不能包含 <script> 標簽。

然後把 .js 文件指定給 <script> 標簽中的 "src" 屬性，就可以使用這個外部文件

提示：您可以把 .js 文件放到網站目錄中通常存放腳本的子目錄中，這樣更容易管理和維護。

聲明（創建） JavaScript 變數

通過 var 語句來聲明 JavaScript 變數：

var firstname;

firstname="George"; 在為變數賦文本值時，請為該值加引號。

document.write(firstname);

document.write("<br />"); <br/>要寫在括弧裡面，加引號

firstname="John";

document.write(firstname);

重新聲明 JavaScript 變數

如果您再次聲明瞭 JavaScript 變數，該變數也不會丟失其原始值。

var x=5;

var x;

在以上語句執行後，變數 x 的值仍然是 5。在重新聲明該變數時，x 的值不會被重置或清除。

If 語句

如何編寫一個 If 語句

var d = new Date()

var time = d.getHours()

if (time < 10)

{

document.write("<b>早安</b>")

}

</script>

如果瀏覽器時間小於 10，那麼會向您問“早安”。

隨機鏈接

本例演示一個隨機的鏈接，當您單擊這個鏈接時，會打開某個隨機的網站。

var r=Math.random()

if (r>0.5)

{

document.write("<a href='../index.htm'/*tpa=http://www.w3school.com.cn/*/>學習 Web 開發！</a>")

}

else

{

document.write("<a href='http://www.microsoft.com/'>訪問微軟！</a>")

}

</script>

Switch 語句

如何編寫一個 Switch 語句。

var d = new Date()

theDay=d.getDay()

switch (theDay)

{

case 5:

document.write("<b>Finally Friday</b>")

break

case 6:

document.write("<b>Super Saturday</b>")

break

case 0:

document.write("<b>Sleepy Sunday</b>")

break

default:

document.write("<b>I'm really looking forward to this weekend!</b>")

}

警告框

<head>

function disp_alert()

{

alert("我是警告框！！")

}

</script>

</head>

<body>

###註意括弧。

</body>

確認框 >>>腳本部分

function show_confirm()

{

var r=confirm("Press a button!"); >>>>confirm()的用法

if (r==true)

{

alert("You pressed OK!");

}

else

{

alert("You pressed Cancel!");

}

</script>

提示框

function disp_prompt()

{

var name=prompt("請輸入您的名字","Bill Gates") >>>>記住prompt的作用

if (name!=null && name!="") >>>>>>相當於一個對話框

{

document.write("你好！" + name + " 今天過得怎麼樣？")

}

</script>

帶有參數的函數 1

如何向函數傳遞變數，以及如何在函數中使用該變數。

function myfunction(txt)

{

alert(txt)

}

</script>

<body>

<form>

</form>

帶有參數的函數 2

function myfunction(txt)

{

alert(txt)

}

</script>

<form>

<input type="button"

onclick="myfunction('早安！')"

value="在早晨">

<input type="button"

onclick="myfunction('晚安！')"

value="在夜晚">

</form>

返回值的函數

如何從函數返回值。

function myFunction()

{

return ("您好，祝您愉快！")

}

</script>

</head>

<body>

document.write(myFunction()) >>>返回值

</script>

For 迴圈

如何編寫 loop 迴圈來按照指定的次數執行相同的代碼。

<body>

for (i = 0; i <= 5; i++)

{

document.write("數字是 " + i)

document.write("<br />")

}

</script>

</body>

迴圈產生 HTML 標題

如何使用Loop迴圈來產生不同的HTML標題

for (i = 1; i <= 6; i++)

{

document.write("<h" + i + ">這是標題 " + i)

document.write("</h" + i + ">")

}

</script>

Do while 迴圈

利用 do...while 迴圈在指定條件為 true 時來迴圈執行代碼。在即使條件為 false 時，這種迴圈也會至少執行一次。這是因為在條件被驗證前，這個語句就會執行。

i = 0

{

document.write("數字是 " + i)

document.write("<br>")

i++

}

while (i <= 5)

</script>

break 語句

使用 break 語句來終止迴圈。

var i=0

for (i=0;i<=10;i++)

{

if (i==3){break} >>>>註意

document.write("數字是 " + i)

document.write("<br />")

}

</script>

For...In 聲明

如何使用 For...In 聲明來遍曆數組內的元素

var x

var mycars = new Array() 》》》事件

mycars[0] = "寶馬"

mycars[1] = "賓士"

mycars[2] = "賓利"

>>>>記住格式

for (x in mycars)

{

document.write(mycars[x] + "<br />")

}

</script>

try...catch 語句

如何編寫 try...catch 語句。

var txt=""

function message()

{

try

{

adddlert("Welcome guest!")

}

catch(err)

{

txt="本頁中存在錯誤。\n\n"

txt+="錯誤描述：" + err.description + "\n\n"

txt+="點擊“確定”繼續。\n\n"

alert(txt)

}

</script>

帶有確認框的 try...catch 語句

另一個編寫 try...catch 語句的例子。

var txt=""

function message()

{

try

{

adddlert("Welcome guest!")

}

catch(err)

{

txt="本頁中存在錯誤。\n\n"

txt+="點擊“確定”繼續查看本頁，\n"

txt+="點擊“取消”返迴首頁。\n\n"

if(!confirm(txt)) 》》》》註意

document.location.href="../index.html"/*tpa=http://www.w3school.com.cn/index.html*/

}

</script>

Throw 聲明

throw 聲明的作用是創建 exception（異常）。你可以把這個聲明與 try...catch 聲明配合使用，以達到控製程序流並產生精確錯誤消息的目的。

var x=prompt("Enter a number between 0 and 10:","")

try

{

if(x>10)

throw "Err1"

else if(x<0)

throw "Err2"

}

catch(er)

{

if(er=="Err1")

alert("Error! The value is too high") >>>>>註意括弧

if(er == "Err2")

alert("Error! The value is too low")

}

</script>