研究一个简单的HTMLElement包装器的想法我偶然发现了Internet Explorer和Chrome的以下内容:
对于DOM树中具有ID的给定HTMLElement,可以使用其ID作为变量名来检索div.所以对于一个喜欢的div
<div id="example">some text</div>
Run Code Online (Sandbox Code Playgroud)
在Internet Explorer 8和Chrome中,您可以执行以下操作:
alert(example.innerHTML); //=> 'some text'
Run Code Online (Sandbox Code Playgroud)
要么
alert(window['example'].innerHTML); //=> 'some text'
Run Code Online (Sandbox Code Playgroud)
那么,这是否意味着DOM树中的每个元素都转换为全局命名空间中的变量?它是否也意味着可以使用它作为getElementById这些浏览器中方法的替代品?
我开始使用的所有浏览器都允许id="myDiv"通过简单地编写来访问元素:
myDiv
Run Code Online (Sandbox Code Playgroud)
见这里:http://jsfiddle.net/L91q54Lt/
无论如何,这种方法似乎记录很少,事实上,我遇到的来源甚至没有提及,而是假设有人会使用
document.getElementById("myDiv")
Run Code Online (Sandbox Code Playgroud)
或者可能
document.querySelector("#myDiv")
Run Code Online (Sandbox Code Playgroud)
即使在事先知道其ID(即不在运行时计算)时也要访问DOM元素.我可以说,后者的方法具有保持代码安全的优势,如果有人无意中尝试myDiv在更广泛的范围内重新定义(虽然不是这么好的想法......),用一些不同的值覆盖它并继续而没有注意到冲突.
但其他那个呢?除了代码设计之外,使用上面的简短形式是否有任何问题,或者我在这里缺少什么?
通常我通过 id 选择元素document.getElementById('idName')。但显然您也可以仅通过名称“idName”来选择它们。直到最近我才意识到这一点。我想知道通过 idName 选择元素是否是一种“不好的做法”?我已经使用了搜索引擎,但没有找到任何关于 的信息select by id name。现在这是我的问题。
console.log(idName)Run Code Online (Sandbox Code Playgroud)
<div id="idName">Hello World</div>Run Code Online (Sandbox Code Playgroud)