给一个元素设置 id 属性,它会在 js 中创建全局变量,如
<div class="test" @click="test" id="idTest">test</div>test() {console.log('idTest:', window.idTest)
}.test {height: 50px;width: 200px;background-color: aliceblue;
}
点击 test
即 window.idTest = document.getElementById("idTest")
HTML5规范文档中指出:如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.
- 如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名.
- 如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个
意思就是上面这些标签设置name 时也会在 window 对象上创建变量,但我试 a 标签不会,其它标签会,但是这种会覆盖全局变量,还会可能导致全局变量命名冲突,占用内存等问题,所以慎用啊。