一、計時器
setTimeout()/clearTimeout()
說明：僅僅只執行一次，執行完成後不再繼續setInterval()/clearInterval()
說明：重複執行，直到clearInterval()
實例
<!DOCTYPE HTML>
<html>
<head>
<title>計時器</title>
<style type="text/css">
#num {
font-size:50px;
color:red;
}
</style>
<script type="text/javascript">
window.onload = init();
function init(){
setInterval("setTime();",1000);/*重複，間隔1s*/
setTimeout("getCount();",5000);/*單次，等待5s後執行*/
}
function setTime(){
var num = document.getElementById("num");
var time = num.innerHTML;
if(time > 0){
num.innerHTML = time - 1;
}
}
function getCount(){
var count = document.getElementById("count");
count.innerHTML = 1 + count.innerHTML;
}
</script>
</head>
<body>
<div>
<lable>時間還剩下</lable>
<lable id="num">20</lable>
<lable>秒----setInterval()</lable>
</div>
<div>
<lable id="count">----setTimeout()</lable>
</div>
</body>
</html>二、歷史記錄
window.history.back()
說明：上一頁window.history.next()
說明：下一頁
實例
第一頁
<!DOCTYPE HTML>
<html>
<head>
<title>歷史記錄-第一頁</title>
<style type="text/css">
a {
text-decoration:none;
background-color:green;
}
</style>
<script type="text/javascript">
function toForward(){
window.history.back();/*前一頁*/
}
function toNext(){
window.history.forward();/*後一頁*/
}
</script>
</head>
<body>
<a href="history-2.html">第二頁</a><br/>
<input type="button" onclick="toForward();" value="上一頁"></input>
<input type="button" onclick="toNext();" value="下一頁"></input>
</body>
</html>第二頁
<!DOCTYPE HTML>
<html>
<head>
<title>歷史記錄-第二頁</title>
<style type="text/css">
a {
text-decoration:none;
background-color:red;
}
</style>
<script type="text/javascript">
function toForward(){
window.history.back();/*前一頁*/
}
function toNext(){
window.history.forward();/*後一頁*/
}
</script>
</head>
<body>
<a href="history-1.html">第一頁</a><br/>
<input type="button" onclick="toForward();" value="上一頁"></input>
<input type="button" onclick="javascript:toNext();" value="下一頁"></input>
</body>
</html>三、對話框
alert()
說明：提示消息類的彈窗confirm()
說明：確定是否操作的彈窗，帶有按鈕，返回布爾類型prompt()
說明：可以接收用戶輸入的消息的彈窗，帶有文本框，返回String
實例
<!DOCTYPE HTML>
<html>
<head>
<title>對話框</title>
<script type="text/javascript">
function testConfirm(){
var a = confirm();
var b = document.getElementById("confirm_value");
b.innerHTML = a;
}
function testPrompt(){
var a = prompt("請輸入內容：");
var b = document.getElementById("prompt_value");
b.innerHTML = a;
var c = document.getElementById("prompt_type");
c.innerHTML = typeof(a);
}
</script>
</head>
<body>
<div>
<lable>alert對話框</lable><br/>
<input type="button" onclick="alert('alert對話框');" value="alert對話框"></input>
</div>
<hr/>
<div>
<lable>confirm對話框</lable><br/>
<input type="button" onclick="testConfirm();" value="confirm對話框"></input><br/>
<lable>接收到的值:</lable>
<lable id="confirm_value"></lable>
</div>
<hr/>
<div>
<lable>prompt對話框</lable><br/>
<input type="button" onclick="testPrompt();" value="prompt對話框"></input><br/>
<lable>接收到的值:</lable>
<lable id="prompt_value"></lable><br/>
<lable>接收到的類型:</lable>
<lable id="prompt_type"></lable>
</div>
</body>
</html>四、獲取內容的三種方式
innerHTML
說明：可以是html內容，也可以是文本innerText
說明：存文本內容value
說明：form表單的內容
