亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

帶有id的DOM樹元素是否成為全局變量?

帶有id的DOM樹元素是否成為全局變量?

喵喵時光機 2019-05-22 15:05:55
帶有id的DOM樹元素是否成為全局變量?研究一個簡單的HTMLElement包裝器的想法我偶然發現了Internet Explorer和Chrome的以下內容:對于DOM樹中具有ID的給定HTMLElement,可以使用其ID作為變量名來檢索div。所以對于一個喜歡的div<div id="example">some text</div>在Internet Explorer 8和Chrome中,您可以執行以下操作:alert(example.innerHTML); //=> 'some text'要么alert(window['example'].innerHTML); //=> 'some text'那么,這是否意味著DOM樹中的每個元素都轉換為全局命名空間中的變量?它是否也意味著可以使用它作為getElementById這些瀏覽器中方法的替代品?
查看完整描述

5 回答

?
智慧大石

TA貢獻1946條經驗 獲得超3個贊

如前面的答案所述,此行為稱為窗口對象上的命名訪問。該值name的某些元素屬性和值id的所有元素的屬性都可用作為全球性質window的對象。這些被稱為命名元素。由于window是瀏覽器中的全局對象,因此每個命名元素都可以作為全局變量訪問。

這最初是由Internet Explorer添加的,最終由所有其他瀏覽器實現,僅僅是為了與依賴于此行為的站點兼容。有趣的是,Gecko(Firefox的渲染引擎)選擇僅以怪癖模式實現此功能,而其他渲染引擎則以標準模式啟用它。

然而,像Firefox 14,火狐現在支持命名訪問window的標準模式對象也是如此。他們為什么改變這個?事實證明,仍有很多網站在標準模式下依賴此功能。微軟甚至發布了一個營銷演示,阻止了該演示在Firefox中運行。

Webkit最近考慮了相反的做法,window僅將對象的命名訪問權限降級為怪癖模式。他們通過與Gecko相同的推理決定反對它。

所以...瘋狂,因為看起來這種行為在標準模式下在所有主流瀏覽器的最新版本中使用現在技術上是安全的。但是雖然命名訪問看起來有點方便,但不應該使用它。

為什么?本文總結了很多關于全局變量為什么不好的原因。簡而言之,擁有一堆額外的全局變量會導致更多錯誤。假設您不小心輸入了a的名稱var并碰巧鍵入了id一個DOM節點,SURPRISE!

此外,盡管標準化,但瀏覽器的命名訪問實現仍然存在很多差異。

  • IE錯誤地使name表單元素(輸入,選擇等)可以訪問屬性的值。

  • Gecko和Webkit錯誤地不會<a>通過其name屬性訪問標簽。

  • Gecko錯誤地處理了多個具有相同名稱的命名元素(它返回對單個節點而不是引用數組的引用)。

如果你嘗試在邊緣情況下使用命名訪問,我相信還有更多。

正如其他答案中所提到的那樣,document.getElementById用來獲取對DOM節點的引用id。如果需要通過其name屬性使用來獲取對節點的引用document.querySelectorAll

請不要在您的站點中使用命名訪問來傳播此問題。如此多的網絡開發人員浪費時間試圖追蹤這種神奇的行為。我們確實需要采取行動并讓渲染引擎在標準模式下關閉命名訪問。從短期來看,它會破壞一些做壞事的網站,但從長遠來看,這將有助于推動網絡向前發展。

如果您有興趣,我可以在我的博客上更詳細地討論這個問題 - https://www.tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/。


查看完整回答
反對 回復 2019-05-22
?
慕的地10843

TA貢獻1785條經驗 獲得超8個贊

getElementById()在這些情況下你應該堅持,例如:

document.getElementById('example').innerHTML

IE喜歡在全局命名空間中混合使用元素name  ID屬性,因此最好明確指出你想要獲得的內容。


查看完整回答
反對 回復 2019-05-22
  • 5 回答
  • 0 關注
  • 724 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號