1、BOM：瀏覽器對象模型
當(dāng)我們使用瀏覽器打開一個網(wǎng)頁程序時，那么，js系統(tǒng)會自動創(chuàng)建對象，首先創(chuàng)建瀏覽器對象window,然后再為window對象創(chuàng)建它的子級對象，最后形成一個樹狀模型，這個就是BOM模型
BOM模型圖
從上圖可以看出，window對象是所有對象的最頂級對象
也就是說，以前，我們寫的 document.write() 實(shí)際上 window.document.write()
我們創(chuàng)建的所有全局變量和全局函數(shù)都是存儲到window對象下的
2、window對象 瀏覽器對象
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) 相對移動
moveTo(x，y) 絕對移動
resizeBy(x，y) 相對改變窗口尺寸
resizeTo(x，y) 絕對改變窗口尺寸
scrollBy(x，y) 相對滾動
scrollTo(x，y) 絕對滾動
setTimeout(表達(dá)式，毫秒) 設(shè)置定時器 執(zhí)行一次
setInterval(表達(dá)式，毫秒) 設(shè)置定時器 反復(fù)執(zhí)行
clearTimeout(定時器對象) 清除定時器
3、navigator 瀏覽器信息對象
appCodeName ：內(nèi)部代碼
appName ：瀏覽器名稱
appVersion ：版本號
platform ：操作系統(tǒng)
onLine ：是否在線
cookieEnabled ：是否支持cookie
4、location 地址欄對象
host ：主機(jī)名
port ：端口號
href ：完整的url信息
pathname ：路徑地址
protocol ：協(xié)議
search ：查詢字符串
assign(url) ：用于頁面跳轉(zhuǎn)
*5、screen 屏幕信息對象
availHeight 可用高度
availWidth 可用寬度
colorDepth 顏色質(zhì)量
height 高度
width 寬度
6、document 文檔對象
linkColor 超鏈接顏色
alinkColor 作用中的超鏈接顏色
vlinkColor 作用后的超鏈接顏色
bgColor 背景顏色
fgColor 字體顏色
title 文檔標(biāo)題
7.獲取元素
getElementById(“id”)
通過id屬性值獲取某個元素
getElementsByName(“name”)
通過name屬性值獲取某些元素
getElementsByTagName(“tagname”)
通過標(biāo)簽名獲取某些元素
簡單代碼
<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>
