1.BOM:browser object model的簡稱,瀏覽器對象模型,將整個瀏覽器頁面看作是window對象.
2.BOM瀏覽對象模型圖:window對象是整個瀏覽器對象模型的核心.
3.history對象:
常用方法:
前進:forward()<==>go(1)
後退:back()<==>go(-1)
刷新:go(0)
4.location對象
常用屬性
獲得當前頁面url:location.href
跳轉頁面(與超鏈接的效果相同):location.href="url";
window.location.href="url";
window.location="url";
常用方法
刷新:reload();<==>history.go(0)
替換頁面:replace("url");
eg:function show1(){
alert(location.href);
}
function show2(){
//location.href="2.history2.html";
window.location="2.history2.html";
}
function show3(){
location.reload();
}
function show4(){
location.replace("1.history1.html");
}
5.window對象
5.1:確定框:alert();
5.2:確定取消框: var boolean類型的變量= confirm("提示語");
5.3:輸入框:var 變量= prompt("提示語",[默認值]);
5.4:打開一個窗體:open("URL","窗體名稱","窗體特徵");
5.5:關閉窗體:close();只有通過 JavaScript 代碼打開的窗口才能夠由 JavaScript 代 碼關閉。這阻止了惡意的腳本終止用戶的瀏覽器。
5.6:在指定的毫秒數後調用一次函數或計算表達式:setTimeout(要執行的代碼或函數, 毫秒);
5.7:取消由 setTimeout() 方法設置的 timeout。clearTimeout(變量名);
5.8:可按照指定的週期(以毫秒計)來調用函數或計算表達式:setInterval(要執行的代 碼或函數, 毫秒);
5.9:取消由 setInterval() 設置的 timeout:clearInterval(變量名);
eg:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>window對象的使用</title>
<script type="text/javascript">
function show1(){
window.alert("這是一個確定框");
}
function show2(){
var result=window.confirm("確定要刪除嗎?");
if (result==true) {
alert("刪除成功");
} else{
alert("那就不刪除了");
}
}
function show3(){
var name=prompt("請輸入你的姓名:","張三");
alert("接收的姓名爲:"+name);
}
function show4(){
window.open("3.location.html","第三個窗體","width=300,height=300,left=300,top=200")
}
var a;
function show5(){
a=window.setTimeout(function(){
alert("要下課了");
},5000);
}
function show6(){
window.clearTimeout(a);
}
var b;
function show7(){
b=window.setInterval(function(){
alert("要休息了");
},6000);
}
function show8(){
window.clearInterval(b);
}
</script>
</head>
<body>
<input type="button" value="彈出一個確定框" οnclick="show1()"/>
<input type="button" value="彈出一個確定取消框" οnclick="show2()"/>
<input type="button" value="彈出一個輸入框" οnclick="show3()"/>
<input type="button" value="彈出一個窗體" οnclick="show4()"/>
<input type="button" value="5秒後我要下課了" οnclick="show5()"/>
<input type="button" value="清除5秒後提示" οnclick="show6()"/>
<input type="button" value="每隔6秒提示我休息" οnclick="show7()"/>
<input type="button" value="清除每隔6秒提示" οnclick="show8()"/>
</body>
</html>
6.js中對象:萬物皆對象.
6.1:自定義對象:
/第一種:創建Json(javaScript object notation)對象/
//聲明一個json對象
var ob1={"sname":"葉倫","sage":"20","ssex":"女"};
//用對象調用屬性:對象.屬性名 或者 對象["屬性名"]
document.write(ob1.sname+","+ob1["sage"]+","+ob1.ssex);
document.write(" ");
/第二種:用Object創建對象/
//創建對象
var ob2=new Object();
//給對象的屬性賦值
ob2.nickName="大齡剩女";
ob2.age=30;
document.write(ob2.nickName+","+ob2["age"]);
document.write(" ");
/第三種:用構造方法創建對象/
//聲明一個構造方法
function person(name,age,address){
this.name=name;
this.age=age;
this.address=address;
}
//用構造方法創建對象
var ob3=new person("林玉詳",90,"千鋒");
var ob4=new person("田其剛",80,"千鋒");
//用對象調用屬性:對象.屬性名 或者 對象["屬性名"]
document.write(ob3.name+","+ob3["age"]+","+ob3.address);
document.write(" ");
document.write(ob4.name+","+ob4["age"]+","+ob4.address);
document.write(" ");
6.2:prototype 屬性使您有能力向對象添加屬性和方法。
eg://聲明一個構造方法
function person(name,age,address){
this.name=name;
this.age=age;
this.address=address;
}
//用prototype給對象添加屬性和方法
person.prototype.sex="女";
person.prototype.showMyself=function(){
document.write(this.name+","+this.age+","+this.address+","+this.sex);
document.write(" ");
};
//用構造方法創建對象
var ob3=new person("林玉詳",90,"千鋒");
var ob4=new person("田其剛",80,"千鋒");
//用對象調用屬性:對象.屬性名 或者 對象["屬性名"]
document.write(ob3.name+","+ob3["age"]+","+ob3.address);
document.write(" ");
document.write(ob4.name+","+ob4["age"]+","+ob4.address);
document.write(" ");
//用對象調用方法
document.write("----------------------------------- ")
ob3.sex="男";
ob3.showMyself();
ob4.showMyself();
6.3:系統對象
Date 日期對象
Array 數組對象
Math 對數字作處理的對象
string 字符串對象
RegExp 正則表達式對象