名稱或ID默認可用的元素

我今天出現了一些代碼，我很確定它不起作用。原來我錯了。這適用於IE和Chrome。名稱或ID默認可用的元素

<img onmouseover="why(this)" src="http://placehold.it/150x100" alt="" /> 
<img onmouseover="why(this)" src="http://placehold.it/100x100" alt="" /> 
<br> 
<img id="preview" src="" alt="" /> 
<img name="preview2" src="" alt="" />

function why(obj) { 
    preview.src = obj.src; 
    preview2.src = obj.src; 
}

爲什麼這項工作？我們是不是應該使用document.getElementById？
FIDDLE

來源

2014-02-23 Jonathan

這應該回答你的問題：http://stackoverflow.com/a/3434388/772035 – Paulpro

它的工作原理，因爲在默認情況下，有id一切都元素轉儲window對象上，用他們的id作爲他們的屬性名稱。有些瀏覽器與name一樣。由於window對象是瀏覽器中的全局對象，因此這些看似獨立的變量將被解析爲window的屬性。

依靠這不是一件好事，因爲全局命名空間非常擁擠，並且很容易對它們進行投影。例如：

function preview() { }

現在用idpreview該元素是不能作爲一個全球性的符號了，因爲我已經有一個函數陰影它。或者

var preview;

熱潮，它不見了。

因此，當您查找元素時使用document.getElementById等等。

重新下方的評論：

當我檢查窗口對象，我不能找物業預覽。一旦我在函數中放置了一個斷點，爲什麼會突然定義window.preview。任何想法如何工作？

我剛剛添加了window.preview作爲手錶表達式，它會返回undefined直到我點擊brekpoint。

我期望在解析那些元素時創建屬性。因此，這取決於您何時停止並查看window：如果您在解析器到達這些DOM元素之前查看它，那麼這些屬性將爲undefined。這就是我與這個網頁看到：

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>ScratchPad</title> 
</head> 
<body> 
<script> 
debugger; 
</script> 
<div id="testelement"></div> 
<script> 
debugger; 
</script> 
</body> 
</html>

作爲第一debugger;聲明，手錶（也使用Chrome的devtools）上window.testelement顯示undefined，但作爲第二debugger;語句，它顯示的div元素。

來源

2014-02-23 17:29:44

當我檢查窗口對象，我找不到'預覽'屬性。一旦我在函數'why'中放置了一個斷點，'window.preview'突然被定義。任何想法如何工作？ – Jonathan

@Jonathan：你是如何檢查窗戶物體的？這些屬性只能在JavaScript層中使用，而不是在DOM層中（比如說）... –

我剛剛添加了'window.preview'作爲監視表達式，它返回'undefined'直到我點擊了brekpoint。（用Chrome devtools測試） – Jonathan

名稱或ID默認可用的元素

回答

相關問題