1. 程式人生 > >JS基礎學習筆記(二)

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)大小而非瀏覽器視窗大小。