document.documentElement用於「in」語句

我在jQuery的源代碼中看到了這段代碼。我是JavaScript的新手，我想知道這是如何工作的。document.documentElement用於「in」語句

if ("getBoundingClientRect" in document.documentElement) { 
// do something... 
}

它是如何從

if(document.documentElement.getBoundingClientRect) { 
// do something... 
}

不同......？

來源

2012-05-15 Gautham Renganathan

這是使用in operator的表達式。 in運算符檢查目標對象是否具有給定名稱的屬性（直接或通過對象的原型）。

它在做什麼看到如果document.documentElement有一個名稱爲getBoundingClientRect（這是一個方便的功能，如果瀏覽器提供它，jQuery會使用它）。

它是如何不同於if(document.documentElement.getBoundingClientRect) { // do something... }

in不需要取的值的屬性，只是檢查它的存在。另請注意，您列出的第二種形式將測試該房產的價值的真實性。對於像getBoundingClientRect這樣的函數來說很好，但如果你想測試其值可能回覆錯誤的東西（0,""等），即使該屬性存在，它也會失敗。

進行功能檢測時，您會看到很多這類事情。舉例來說，如果你想知道，如果瀏覽器支持HTML5的placeholder屬性：

if ('placeholder' in document.createElement('input')) { 
    // Yes, it does 
}

這是一個例子，我們不能使用的形式if (document.createElement('input').placeholder)，因爲如果條件是假的，我們不知道是否它是虛假的，因爲該屬性不存在，或者是虛假的，因爲該屬性存在但是具有虛假值（並且placeholder的默認值是""，這確實是錯誤的）。

Gratuitous link to list of feature detections.

來源

2012-05-15 05:30:59

非常感謝。現在很明顯:) –

@ GauthamRenganathan：很好，這很有幫助。 –

從MDN 中操作者如果指定的屬性是在指定的對象返回true。

語法：

prop in objectName

丙的字符串或表示屬性名或數組索引數值表達式。

objectName：對象的名稱。

so document.documentElement是對象，"getBoundingClientRect"是屬性。

來源

2012-05-15 05:33:35

'a' in obj不同於obj.a if a == false。

obj = {a: false}; 
'a' in obj; 
> true 
obj.a 
> false

來源

2012-05-15 05:37:09

in運算符檢查給定的屬性是否存在或存在於指定的對象中。 SO，

if ("getBoundingClientRect" in document.documentElement) { 
// do something... 
}

將檢查getBoudingClientRect財產document.documentElement對象是可用的。

此外，您可能想要閱讀約翰Resig自己的article形式，他已經很好地解釋了，爲什麼使用它。

來源

2012-05-15 05:38:08 Starx

document.documentElement用於「in」語句

回答

相關問題