<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<title>Test</title>
</head>
<body>
<form name="form1" action="" >
<input type="text" name="name1" id="id1" />
<input type="text" name="name2" id="id2" />
</form>
<div id="result" ></div>
<script type="text/javascript">
var myform=document.forms.item(0);
var result=document.getElementById('result');
var mystr;
mystr=myform.elements.namedItem("id1").tagName;
result.appendChild(document.createTextNode(mystr));
result.appendChild(document.createElement("br"));
mystr=myform["id2"].tagName;
result.appendChild(document.createTextNode(mystr));
</script>
</body>
</html>
在W3C中，一般通过属性返回的元素集合叫HTMLCollection，如document.forms.通过方法返回的叫Node List,如getElementByTagName.
HTMLCollection可以通过item方法用索引访问，索引按深度优先排序，通namedItem方法按id访问（HTML4.01支持id和name,xhtml只有id）。而Node List只能通过item来访问
而实际中所有浏览器HTMLCollection的item方法既可以用id访问又可以用name访问
对于Node List，只有Chrome在XHTML下不能通过namedItem和name访问元素（用item仍然支持id访问）。其它浏览器与HTMLCollection访问方法完全相同
至于数组语法访问HTMLCollection和Node List未见W3C有相关说明，不过从实现上看数组访问的结果与item访问的结果完全一样，也可能数组是item和namedItem的合集。
建议不要在任何时候用name访问集合中的元素。用item时也不要用id和name访问元素，当用id访问元素时要用数组语法或namedItem方法(仅HTMLCollection)。不要用id和name访问Node List
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<title>Test</title>
</head>
<body>
<form name="form1" action="" >
<input type="text" name="name1" id="id1" />
<input type="text" name="name2" id="id2" />
</form>
<div id="result" ></div>
<script type="text/javascript">
var myform=document.getElementsByTagName("input");
var result=document.getElementById('result');
var mystr;
mystr=myform[0].tagName;
result.appendChild(document.createTextNode(mystr));
result.appendChild(document.createElement("br"));
mystr=myform.item(1).tagName;
result.appendChild(document.createTextNode(mystr));
</script>
</body>
</html>
分享到：
相关推荐
在此基础上，我对jQuery源码(1.11.3)查找dom节点相关的内容进行了仔细的查阅，虽然并不能理解的很深入 。。同时基于对浏览器console对象的了解产生了一系列之后的问题和分析，对jQuery最常用的三种dom查找方式进行了...
范 例 xmlDocument ————————————————————————————- AppendChild 方法 作 用 加上一个节点当作指定节点最后的子节点。 基本语法 xmlDocumentNode.appendChild(newChild); 说 明 new...
代码说明：本章代码都具有一定危害性，可按照页面提示进行操作。 32.1.htm 字符串翻倍 32.2.htm 函数循环交叉调用 32.3.htm 无限递归调用 32.4.htm 构造无限数组 32.5....
pasteHTML()是一个方法，在指定的文字区域内替换该区域内的文本或者HTML，该方法必须应用于一个 createTextRange() 或者 document.selection.createRange() 创建的区域上 例： [removed] function addLink(){ var ...
JsoupXpath 是一款纯Java开发的使用xpath解析html的解析器，xpath语法分析与执行完全独立，html的DOM树生成借助Jsoup，故命名为JsoupXpath.为了在java里也享受xpath的强大与方便但又苦于找不到一款足够强大的xpath...
选择树的一个节点时，如何得到这个节点？ 70.向编辑框中输入字符时，如何控制只输入整数？ 71.描述使用JDBC连接数据库的过程 72.EJB分为几类？什么是BMP,CMP? 73.什么是JNDI? 74.ADO是什么?ActiveX数据对象,是...
以 v-transition=”my-transition” 这个指令为例，当带有这个指令的 DOM 节点被插入或移除时，Vue 将会： 用 my-transition 这个 ID 去查找是否有注册过的 JavaScript 钩子对象。这个对象可以是由 Vue.transition...
节点包> 安装 如果需要，可使用Polyfill标签。 这将包括ShadowDOM和自定义元素支持。 [removed][removed] 加载此组件。 使用特定版本而不是latest版本是一个好主意。 [removed][removed] 例 用法 将name属性设置为...
另一方面，框架会通过虚拟dom及diff算法提高页面性能。这其中需要数据优先最根本的思路就是实现数据响应式。so，本次来看下如何基于原生实现数据响应式。 vue中的数据响应 vue中会根据数据将数据通过大胡子语法及...
向浏览器添加一个SVG导出按钮，该按钮将页面上显示的SVG DOM元素作为包含CSS的文件输出。 将网页上的所有SVG DOM元素（现在包括同源IFrame中的元素）导出到文件中，以供在Inkscape之类的图形包中进一步使用。在CSS类...
一个DOM树里的节点知道它在哪里和它包含了什么。 （当一个XML文档中的节点用SAX解析时只有当解析到该节点时它才有意义。） 绝大多数模板方案使用简单的过程语言和这样的模板标签： ＜p＞{some
前言 Vue 中的 key 是用来做什么的？为什么不推荐使用 index 作为 key？常常听说这样的问题，本篇文章带你从原理来一探究竟。...那么它的 vnode 也就是虚拟 dom 节点大概是这样的。 { tag: 'ul',
一、定义 观察者模式（发布-订阅模式）...二、DOM事件–观察者模式典例 需要监控用户点击document.body的动作，但是我们没有办法预知用户将在什么时间点击。 所以，我们订阅document.body上的click事件，当body节点被
Uke是一个小的javascript库，用于编写javascript应用程序。 目的 我写这个库是为了提高我的原始javascript知识，并了解React，Vue或Angular等现代javascript框架的工作方式。 这个库对其他库有（并且永远不会）有...