BOM

Screen對象

console.log(window.width);//屏幕寬度
console.log(window.height);//屏幕高度
console.log(window.availWidth);//屏幕可用寬度
console.log(window.availHeight);//屏幕可用寬度


★ location對象

取到瀏覽器的URL地址信息：
完整的URL路徑：
協議名：//主機名(IP地址):端口號/文件所在路徑?傳遞參數(name1=value1&name2=value2)#錨點

使用JS跳轉頁面:
location = "http://www.baidu.com";

其他使用location提供的方法跳轉頁面的方式
location.assign("http://www.baidu.com");
location.replace("http://www.baidu.com");
location.reload("http://www.baidu.com");

function replace(){
//使用新文檔替換當前文檔，替換以後，不能回退
location.replace("http://www.baidu.com");
}

function reload(){
重新加載當前文檔，刷新頁面
reload():在本地刷新當前頁面，相當於F5
reload():強制刷新，從服務器端重新加載頁面，相當於ctrl+F5強制刷新頁面
location.reload();
}

/*
history 瀏覽歷史
1、
console.log(history);
console.log(history.length); //表示瀏覽歷史個數

function back(){
history.back(); 後退按鈕
}
function forward(){
history.forward(); 前進按鈕
}
function go(){
跳轉到瀏覽歷史的任意一個頁面：
0表示當前頁面，-1表示後一頁(back)，1表示前一頁(forward)
}

navigator 了解即可
包含瀏覽器的各種系統信息。

console.log(navigator);

檢測瀏覽器安裝的各種插件。

console.log(navigator.plugins);

Window對象的常用方法
在window對象中的所有方法和屬性，均可以省略window關鍵字。
window.alert(); 》彈窗
1.alert():彈出一個警告提示框；
2.prompt():彈出接受用戶的輸入；
3.confirm():彈出帶有“確定”“取消”按鈕的對話框，點擊按鈕返回
4.close():關閉當前瀏覽器窗口。在個別瀏覽器中，只能關閉再當前腳本新打開的頁面
(使用超鏈接、window.open()等方式打開)
5.open():打開一個新窗口。
參數一：新窗口的地址；
參數二：新窗口的名字，並沒什麽用；
參數三：新窗口的各種屬性設置，"屬性=值1，屬性2=值2，屬性3=值3"
6.setTimeout: 設置延時執行，只會執行一次；
setInterval: 設置定時器，每隔n毫秒執行一次。
接受兩個參數：需要執行的function、毫秒數。
7.clearTimeout:清除延時器
clearInterval:清楚定時器
使用方法：設置延時器或者定時器時。可以使用變量接受定時器ID；
var id =setInterval；
調用clearInterval時，將id傳入，即可清除對應的定時器；
clearInterval(id);

　　　　DOM

【DOM樹節點】
DOM樹節點分為三大類：元素節點、屬性節點、文本節點:
文本節點、屬性節點屬於元素節點的子節點，操作時，均需要先取到元素節點，在操作子節點。
可以使用getElement系列方法，取到元素節點。

【查看元素節點】

getElementById：通過Id取到唯一節點。如果Id重名，只能取第一個。
getElementsByName() ：通過name屬性
getElementsByTagName() ：通過標簽名
getElementsByClassName() ：通過class名

獲取元素節點時，一定要註意：獲取節點的語句，必須在DOM渲染完成之後執行，可以有兩種方式實現：
① 將js代碼寫在body之後；② 將js代碼寫在window.onload函數中。
後面三個getElements，取到的是數組格式，不能直接添加各種屬性，而應該取出數組的每一個單獨操作。
例如：getElementsByName("name1")[0].onclick=function


【查看/設置屬性節點】
1.查看屬性節點：getAttribute("屬性名");
2.設置屬性節點：setAttribute("屬性名"，"新屬性值");
查看和設置屬性節點，必須先取到元素節點，才能使用。

eg：

var btn1=document.getElementById("btn1");
btn1.onclick=function(){
　　alert(btn1);
}

var input1=document.getElementByname("input");

JS學習四（BOM DOM）