getElementsByName方法的出身
定义
在几个 getElementsBy*
方法中,getElementsByName
算是比较特殊的,表面上看即只有它不能在 Element
上调用。
W3C 将该方法定义在 HTMLDocument 接口中:
interface HTMLDocument : Document {
attribute DOMString title;
readonly attribute DOMString referrer;
readonly attribute DOMString domain;
readonly attribute DOMString URL;
attribute HTMLElement body;
readonly attribute HTMLCollection images;
readonly attribute HTMLCollection applets;
readonly attribute HTMLCollection links;
readonly attribute HTMLCollection forms;
readonly attribute HTMLCollection anchors;
attribute DOMString cookie;
void open();
void close();
void write(in DOMString text);
void writeln(in DOMString text);
NodeList getElementsByName(in DOMString elementName);
};
按照此定义, getElementsByName
方法应该仅存在于 HTMLDocument
中而非 Document
中。在能够访问 Document
接口的浏览器(Opera,Chrome,Firefox,Safari和 Internet Explorer 10)中,测试下列代码:
!!Document.prototype.getElementsByName
结果如下:
浏览器 | Opera | Chrome | Firefox | Safari | IE10 |
---|---|---|---|---|---|
结果 | false | true | false | true | true |
分别观察一下 Gecko 和 Webkit 关于 (HTML)Document
部分的 IDL :
//Gecko 中 HTMLDocument.webidl 文件
interface HTMLDocument : Document {
NodeList getElementsByName(DOMString elementName);
};
//Webkit 中 Document.idl 文件
interface Document : Node {
NodeList getElementsByName([Default=Undefined] optional DOMString
}
可见两者将 getElementsByName
定义在了不同的接口中,似乎 Gecko 的做法更符合 W3C 规范。
对此的解释可能是 Webkit 和 Internet Explorer
按照 whatwg 的 HTML5 草案进行了实现。
返回类型
关于 getElementsBy*
方法的返回类型,whatwg 规定为 HTMLCollection
, W3C 规定为 NodeList
。HTMLCollection
和 NodeList
两者很类似,都有 length 属性,都可以用数字索引或 item()
方法方位其中元素。但其差异也是明显的,前者成员为 HTMLElement
,而后者为 Node
,前者拥有 namedItem()
方法。现代浏览器对其实现不一致:
浏览器 | Opera/Safari/Android | Chrome/Firefox | Internet Explorer(+WP8) |
---|---|---|---|
getElementsByTagName | NodeList | HTMLCollection | HTMLCollection |
getElementsByName | NodeList | NodeList | HTMLCollection |
getElementsByClassName | NodeList | HTMLCollection | HTMLCollection |
显然应该退化到 Node
和 NodeList
进行编程,避免依赖特定的类型返回值。