Blackbing Playground

[javascript] 跨瀏覽器的屬性判斷

今天在抓蟲的時候發現一個很容易出錯的地方。當我們在宣告變數時,常常會因為不同的 browser 有不同的 API 定義,然後用以下的寫法來判斷宣告哪一個屬性,例如:

1
var fullscreenElement = document.mozFullScreenElement || document.webkitFullscreenElement || document.fullscreenElement;

attribute。
1
2
3
4
5
6
7
不過要小心 javascript 的值當成條件時的判斷。
例如:
```javascript
var sLeft = window.screenLeft || window.screenX; //firefox use screenX
console.log(sLeft);

這段程式希望 screenLeft 會回傳 window.screenLeft ,而在 firefox 會回傳 window.screenX。reference: Window screenLeft and screenTop Properties

但是如果 screenLeft 剛好等於 0 的時候,就會進入

gg 了。
1
2
3
4
5
6
因此建議在值的判斷還是正統一點用 ```hasOwnProperty``` 或 ```typeof``` 來判斷會比較精準。
```javascript
var sLeft = window.screenLeft;
if( !window.hasOwnProperty('screenLeft')) sLeft = window.screenX;