先来看一个例子:
不获取 id 也可以使用 id 元素。
<!-- Author: XiaoWen Create a file: 2017-01-11 13:58:01 Last modified: 2017-01-11 14:00:28 Start to work: Finish the work: Other information: --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="box">小文你好</div> </body> <script> console.log(box.innerText) //小文你好 //上面的 box 并没有使用 var box=document.getElementById('box') 来首先获得元素 </script> </html>
其实,不只是 id 可以这样, name 也是可以的。
再来一个例子:
不获取 name 也可以使用 name 元素。
<!-- Author: XiaoWen Create a file: 2017-01-11 13:58:01 Last modified: 2017-01-11 14:18:43 Start to work: Finish the work: Other information: --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="mydiv">小文你好</div> <img name="mypic" src="" alt=""> <form name="myform" action=""></form> <a name="mya" href="http://www.baidu.com">a1</a> </body> <script> console.log(mydiv) console.log(mypic) console.log(myform) console.log(mya) //* </script> </html>
为什么可以不获取,h5是这么说的
HTML5规范文档中指出:如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.
- 如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名.
- 如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个.
实用性如何
实际测试了下,上面所说的a标签不能直接使用 name 获得,但img可以。
所以,不好意思,即使是id,在实际项目中并不建议使用。
可以临时用来做做代码调试,懒得去 document.get... 也是可以的。就像 xpath 或 ff 的元素零时变量。
为什么不建议,即使是id,在一些浏览器控制台中使用此方法时,会得到浏览器的警告。
为什么要听浏览器的?我觉得浏览器很厉害。大牛的结晶,大牛的建议,听一下还是可以的。
当然,更深层或更官方的原因,还望有高人告知。