Javascript:setAttribute()vs element.attribute = value来设置"name"属性

Question

所以我正在学习操纵DOM,我注意到一件有趣的事情:

假设我想name使用"." 设置元素的属性.点符号:

element.name = "someName";
console.log(document.getElementsByName("someName")[0]); // returns "undefined"??

但是,如果我使用该document.setAttribute()方法,它可以正常工作:

element.setAttribute("name", "someName");
console.log(document.getElementsByName("someName")[0]); // returns the element like it should.

不确定为什么点符号方法在第一种情况下不起作用.

为什么会这样？

Answer 1

我的猜测(因为你没有指定元素类型)是元素通常没有name属性,所以设置这样的DOM属性是行不通的.

例如,name在input元素上设置属性将起作用.设置它div不会.

然而,它会起作用setAttribute().

jsFiddle.

Answer 2

扩展其他一些人提供的答案......

属性"name"仅被视为少数特定对象的有效DOM.根据https://developer.mozilla.org/en-US/docs/DOM/element.name,这些对象是:

 <a>, <applet>, <button>, <form>, <frame>, <iframe>, <img>, <input>, 
 <map>, <meta>, <object>, <param>, <select>, and <textarea>

对于这些对象,您可以使用object.nameBUT FOR ANY OTHER DOM OBJECT 设置,获取和更改name属性,属性"name"是自定义属性,必须使用SetAttribute()或通过将其添加到HTML声明来创建.一旦创建它,​​你可以使用它来访问它setAttribute(),getAttribute()或者你可以直接参考它的值,object.attributes.name.value看看http://jsfiddle.net/radiotrib/yat72/1/作为例子.BTW - 负载上的警报框是故意的 - 检查代码以查看原因...