使用“.childNodes”从javascript访问HTML DOM元素`_Javascript_Dom

使用“.childNodes”从javascript访问HTML DOM元素`

javascript dom

使用“.childNodes”从javascript访问HTML DOM元素`,javascript,dom,Javascript,Dom,我想知道.childNodes属性，我有下面的代码，出于某种原因，我得到了18个子元素，而6个是HTMLInputElements，正如预期的那样，其余的是未定义的。这是怎么回事？是否有一种有效的方法来迭代输入元素 <html> <head> <script> window.onload = function(e){ form = document.getElementById('myForm'); aler

我想知道

.childNodes

属性，我有下面的代码，出于某种原因，我得到了18个子元素，而6个是

HTMLInputElement

s，正如预期的那样，其余的是

未定义的

。这是怎么回事？是否有一种有效的方法来迭代

输入

元素

<html>
  <head>
    <script>
    window.onload = function(e){
        form = document.getElementById('myForm');
        alert(form.childNodes.length);
        for(i=0; i<form.childNodes.length; i++){
            alert(form[i]);
        }
    }
    </script>
  </head>
  <body>
<form id='myForm' action="haha" method="post">
Name: <input type="text" id="fnameAdd" name="name" /><br />
Phone1: <input type="text" id="phone1Add" name="phone1" /><br />
Phone2: <input type="text" id="phone2Add" name="phone2" /><br />
E-Mail: <input type="text" id="emailAdd" name="email" /><br />
Address: <input type="text" id="addressAdd" name="address" /><br />
<input type="submit" value="Save" />
</body>
</html>


window.onload=函数（e）{
form=document.getElementById（'myForm'）；
警报（form.childNodes.length）；
for（i=0；ichildNodes也返回文本节点；这可能是您感到困惑的原因
要遍历所有的子节点，但只关注输入，只需检查节点的标记名属性。如果节点是文本节点，则不会有标记名，如果节点确实有标记名，则可以检查标记名==“输入”。
子节点也会返回文本节点；这可能是造成混淆的原因
要遍历所有子节点，但只关注输入，只需检查节点的标记名属性。如果节点是文本节点，则不会有标记名，如果节点有标记名，则可以检查标记名是否=“输入”
如果您需要所有元素，包括br
，请使用.children
。这将只提供元素节点。我认为旧版IE不正确地包含注释节点，但您的代码中没有注释节点，因此没有问题
或者你可以
form.getElementsByTagName('input')

…假设您只需要输入
元素
除此之外：您忘了关闭表单
元素。
文本节点，即使它们仅由空格组成，也将包括在输出中，br
元素也是如此
如果您需要所有元素，包括br
，请使用.children
。这将只提供元素节点。我认为旧版IE不正确地包含注释节点，但您的代码中没有注释节点，因此没有问题
或者你可以
form.getElementsByTagName('input')

…假设您只需要输入
元素
除此之外：您忘记关闭表单
元素。
表单元素是访问表单中每个元素的快捷方式-
window.onload = function(e){
        var s='', form = document.getElementById('myForm'),
        L=form.elements.length;
        s=L+'\n';
        for(var i=0;i<L; i++){
            s+= (form[i].name || form[i].id)+'='+form[i].value+'\n';
        }
        alert(s);
    }

window.onload=函数（e）{
var s=''，form=document.getElementById（'myForm'），
L=形式、元素、长度；
s=L+'\n'；
for（var i=0；iform.elements是访问表单中每个元素的快速方法-
window.onload = function(e){
        var s='', form = document.getElementById('myForm'),
        L=form.elements.length;
        s=L+'\n';
        for(var i=0;i<L; i++){
            s+= (form[i].name || form[i].id)+'='+form[i].value+'\n';
        }
        alert(s);
    }

window.onload=函数（e）{
var s=''，form=document.getElementById（'myForm'），
L=形式、元素、长度；
s=L+'\n'；
对于（var i=0；i用于获取表单中的所有表单字段，或获取表单中的输入
元素。
用于获取表单中的所有表单字段，或获取表单中的输入
元素。
或，如“我不是我是”建议您改为使用.children，尽管您仍然需要检查.tagName以仅获取输入。或者，正如有人评论的那样（不确定删除了谁的评论），您可以使用jQuery；jQuery表达式$（“#myForm INPUT”）.get（）将返回您想要的。或者，作为“不是我是”返回建议您改为使用.children，尽管您仍然需要检查.tagName以仅获取输入。或者，正如有人评论的那样（不确定删除了谁的评论），您可以使用jQuery；jQuery表达式$（“#myForm INPUT”）.get（）会返回您想要的内容。只需访问www.jquery.com；他们有非常好的文档。或者，如果您想要一个循序渐进的教程，只需谷歌“jquery教程”；还有很多。只需访问www.jquery.com；他们有非常好的文档。或者，如果您想要一个循序渐进的教程，只需谷歌“jquery教程”；有很多。这给了我11个孩子（在chrome和IE9中）@Martin：刷新浏览器以查看我答案的最新更新。请注意element.children
不受IE9之前的IE版本的支持。@MaratTanalin:当然。它受（至少）支持IE5.5及以上版本。啊，正确。但是，在IE8中，元素.children
也包含注释节点，因此无论如何它都不可靠。这给了我11个子元素（在chrome和IE9中）@马丁：刷新浏览器以查看我的答案的最新更新。请注意，早于IE9的IE版本不支持element.children
。@MaratTanalin:当然支持。IE5.5及以上版本支持它。啊，正确。但是，在IE8中，element.children
也包括注释节点，因此无论如何都不可靠。