JS基礎學習筆記(二)
1.全域性變數不能通過 delete 操作符刪除,而直接在 window 物件上的定義的屬性可以。
如下:
var age = 29;
window.color = "red";
//在 IE < 9 時丟擲錯誤,在其他所有瀏覽器中都返回 false
delete window.age;
//在 IE < 9 時丟擲錯誤,在其他所有瀏覽器中都返回 true
delete window.color; //returns true
alert(window.age); //29
alert(window.color); //undefined
2. 視窗位置
用來確定和修改 window 物件位置的屬性和方法有很多。IE、Safari、Opera 和 Chrome 都提供了screenLeft 和 screenTop 屬性,分別用於表示視窗相對於螢幕左邊和上邊的位置。Firefox 則在screenX 和 screenY 屬性中提供相同的視窗位置資訊,Safari 和 Chrome 也同時支援這兩個屬性。Opera雖然也支援 screenX 和 screenY 屬性,但與 screenLeft 和 screenTop 屬性並不對應,因此建議大家不要在 Opera 中使用它們。使用下列程式碼可以跨瀏覽器取得視窗左邊和上邊的位置。
var leftPos = (typeof window.screenLeft == "number") ?
window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ?
window.screenTop : window.screenY;
這個例子運用二元操作符首先確定 screenLeft 和 screenTop 屬性是否存在,如果是(在 IE、Safari、Opera 和 Chrome 中),則取得這兩個屬性的值。如果不存在(在 Firefox 中),則取得 screenX和 screenY 的值。
3.視窗大小
跨瀏覽器確定一個視窗的大小不是一件簡單的事。IE9+、Firefox、Safari、Opera 和 Chrome 均為此提供了 4 個屬性:innerWidth、innerHeight、outerWidth 和 outerHeight。
在 IE9+、Safari 和 Firefox中,outerWidth 和 outerHeight 返回瀏覽器視窗本身的尺寸(無論是從最外層的 window 物件還是從某個框架訪問)。
在 Opera中,這兩個屬性的值表示頁面檢視容器的大小。而 innerWidth 和 innerHeight則表示該容器中頁面檢視區的大小(減去邊框寬度)。
在 Chrome 中,outerWidth、outerHeight 與innerWidth、innerHeight 返回相同的值,即視口(viewport)大小而非瀏覽器視窗大小。