JavaScript學習日誌（四）：BOM
BOM的核心對象就是window，這一章沒什麽好說的，總結一些比較常用的：
1，a未定義，
a; //報錯
window.a; //undefined
不能用delete刪除全局變量
2，html5不支持<frame>標簽，但是支持<iframe>標簽
3，js中window對象的top，opener，parent，self屬性（雖然對於window來說，它們是一種屬性，但是也可以直接用他們作為對象）的區別：
top：該變更永遠指分割窗口最高層次的瀏覽器窗口。如果計劃從分割窗口的最高層次開始執行命令，就可以用top變量。
opener：用於在window.open的頁面引用執行該window.open方法的的頁面的對象。如果a頁面使用了window.open()了b頁面，那麽我們在b頁面要引用a頁面，就可以使用opener對象，前提是必須是用window.open()方法打開的才能用；
parent：在iframe,frame中生成的子頁面中訪問父頁面的對象。例如：A頁面中有一個iframe或frame，那麽iframe或frame中的頁面就可以通過parent對象來引用A頁面中的對象。這樣就可以獲取或返回值到A頁面中。（不要和jquery的parent()方法混淆）
self：指當前窗口
4，窗口位置
screenLeft,screenTop : IE, Safari, Opera, Chrome
screenX, screenY : Firefox, Safari, Chrome
跨瀏覽器獲取窗口左邊上邊位置：
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
window窗口位置移動（這兩個方法可能瀏覽器禁用）：
window.moveTo(200,200); //將窗口向下移動到200像素，向右移動到200像素。（0，0）是屏幕左上角
window.moveBy(-50,100); //將窗口向下移動100像素，向左移動50像素
網頁可見區域寬：document.body.clientWidth
網頁可見區域高：document.body.clientHeight
網頁可見區域寬：document.body.offsetWidth (包括邊線的寬)
網頁可見區域高：document.body.offsetHeight (包括邊線的寬)
網頁正文全文寬：document.body.scrollWidth
網頁正文全文高：document.body.scrollHeight
網頁被卷去的高：document.body.scrollTop
網頁被卷去的左：document.body.scrollLeft
網頁正文部分上：window.screenTop
網頁正文部分左：window.screenLeft
屏幕分辨率的高：window.screen.height
屏幕分辨率的寬：window.screen.width
屏幕可用工作區高度：window.screen.availHeight
屏幕可用工作區寬度：window.screen.availWidth
頁面視口大小（跨瀏覽器）：
var pageWidth = window.innerWidth;
var pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){
if(document.compatMode == "CSS1Compat"){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else {
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
5，prompt(que,ans);
que: 對話框的問題
ans: 默認答案
6，location對象：
window.location === document.location; //true
location.hash; //URL中的hash
location.href; //返回的是完整的URL，如果等於一個URL，就相當於跳轉到這個URL上
location.host; //返回的是服務器名稱和端口號(如果有)
location.hostname; //不帶端口號的服務器名稱
location.port; //端口號
location.protocol; //頁面使用的協議，”http:”或”https:”
location.search; //URL查詢的字符串，以問好開頭的，可以用location.search.substring(1)，表示問號後面的所有字符串，這裏的字符串是經過編碼的，要用decodeURIComponent(str)來解碼
7，URI三種解碼與編碼的對比：
decodeURI() & encodeURI()：十六進制編碼，如果url進行跳轉，可以用它來編碼，例如：Location.href=encodeURI(http://cang.baidu.com/do/s?word=百度&ct=21);
decodeURIComponent() & encodeURIComponent()：也是十六進制編碼，但是比上面的要更復雜，更細，特殊符號也會轉碼，所以適用於作為參數來使用，例如：<script language="javascript">document.write(‘<a href="http://passport.baidu.com/?logout&aid=7&u=‘+encodeURIComponent ("http://cang.baidu.com/bruce42")+‘">退出</a>‘);</script>
escape() & unescape()：不推薦使用
8，位置操作：
location.href= “url”; //推薦使用
location.assign= “url”; //等同於上面
location.replace(“url”); //跳轉後不能後退，這個有點類似與vue-router裏面，this.$router.push和this.$router.replace的區別
location.reload(); //重新加載
9，navigator對象：
主要是針對於客戶端瀏覽器的一些屬性，多的不說了，
navigator.onLine; //是否連網
navigator.appName; //瀏覽器完整名字
10，screen對象：
最常用的就是分辨率了：
window.screen.width/height
11，history對象：
history.go(-1); //後退一頁
history.go(1); //前進一頁
history.back(); //後退一頁
history.forward(); //前進一頁
JavaScript學習日誌（四）：BOM