1疑俭、BOM:瀏覽器對(duì)象模型
當(dāng)我們使用瀏覽器打開一個(gè)網(wǎng)頁程序時(shí)粮呢,那么,js系統(tǒng)會(huì)自動(dòng)創(chuàng)建對(duì)象,首先創(chuàng)建瀏覽器對(duì)象window,然后再為window對(duì)象創(chuàng)建它的子級(jí)對(duì)象啄寡,最后形成一個(gè)樹狀模型豪硅,這個(gè)就是BOM模型
從上圖可以看出,window對(duì)象是所有對(duì)象的最頂級(jí)對(duì)象
也就是說挺物,以前懒浮,我們寫的 document.write() 實(shí)際上 window.document.write()
我們創(chuàng)建的所有全局變量和全局函數(shù)都是存儲(chǔ)到window對(duì)象下的
2、window對(duì)象 瀏覽器對(duì)象
alert(message) 消息框
confirm(message) 確認(rèn)框 如果點(diǎn)擊確定识藤,返回true,否則返回false
prompt(message[砚著,defstr]) 輸入框 返回值為用戶輸入的數(shù)據(jù)
open(url[,name[痴昧,features]]) 打開新窗口
close() 關(guān)閉窗口
blur() 失去焦點(diǎn)
focus() 獲得焦點(diǎn)
print() 打印
moveBy(x稽穆,y) 相對(duì)移動(dòng)
moveTo(x,y) 絕對(duì)移動(dòng)
resizeBy(x赶撰,y) 相對(duì)改變窗口尺寸
resizeTo(x舌镶,y) 絕對(duì)改變窗口尺寸
scrollBy(x,y) 相對(duì)滾動(dòng)
scrollTo(x豪娜,y) 絕對(duì)滾動(dòng)
setTimeout(表達(dá)式餐胀,毫秒) 設(shè)置定時(shí)器 執(zhí)行一次
setInterval(表達(dá)式,毫秒) 設(shè)置定時(shí)器 反復(fù)執(zhí)行
clearTimeout(定時(shí)器對(duì)象) 清除定時(shí)器
3瘤载、navigator 瀏覽器信息對(duì)象
appCodeName :內(nèi)部代碼
appName :瀏覽器名稱
appVersion :版本號(hào)
platform :操作系統(tǒng)
onLine :是否在線
cookieEnabled :是否支持cookie
4否灾、location 地址欄對(duì)象
host :主機(jī)名
port :端口號(hào)
href :完整的url信息
pathname :路徑地址
protocol :協(xié)議
search :查詢字符串
assign(url) :用于頁面跳轉(zhuǎn)
*5、screen 屏幕信息對(duì)象
availHeight 可用高度
availWidth 可用寬度
colorDepth 顏色質(zhì)量
height 高度
width 寬度
6惕虑、document 文檔對(duì)象
linkColor 超鏈接顏色
alinkColor 作用中的超鏈接顏色
vlinkColor 作用后的超鏈接顏色
bgColor 背景顏色
fgColor 字體顏色
title 文檔標(biāo)題
7.獲取元素
getElementById(“id”)
通過id屬性值獲取某個(gè)元素
getElementsByName(“name”)
通過name屬性值獲取某些元素
getElementsByTagName(“tagname”)
通過標(biāo)簽名獲取某些元素
簡(jiǎn)單代碼
<script>
location.href='demo19.html';
//location.assign('demo19.html');
var x=window.screen.width;
var y=window.screen.height;
document.write('?úμ??á??·?±??ê£o'+x+'*'+y+'<br>');
document.write(navigator.appCodeName+'<br>');
document.write(navigator.appName+'<br>');
document.write(navigator.appVersion+'<br>');
document.write(navigator.platform+'<br>');
document.write(navigator.cookieEnabled+'<br>');
document.write(navigator.onLine+'<br>');
//?D???í?§??ê??????ˉàà?÷
var str=window.navigator.appVersion;
if(str.indexOf('MSIE')>0){
alert('IE');
}else{
alert('w3c');
}
</script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script>
window.onload=function(){
document.getElementById('btn1').onclick=function(){
document.getElementById('div1').innerHTML='hello,javascript!';
document.getElementById('div1').style.color='red';
};
document.getElementById('btn2').onclick=function(){
var div=document.getElementsByTagName('div');
for(var i=0;i<div.length;i++){
div[i].style.color='blue';
}
};
document.getElementById('btn3').onclick=function(){
var ft=document.getElementsByName('ft');
for(var i=0;i<ft.length;i++){
ft[i].value='hello!';
}
}
}
</script>
</head>
<body>
<div id='div1'>div1</div>
<div id='div2'>div2</div>
<div id='div3'>div3</div>
<input type='button' name='ft' id='btn1' value='byid'>
<input type='button' name='ft' id='btn2' value='bytagname'>
<input type='button' name='ft' id='btn3' value='byname'>
</body>
</html>