IE7中的getElementsByName

时间:2008-11-10 18:26:24

标签: javascript dom internet-explorer-7

我有一些代码这样做:

 var changes = document.getElementsByName(from);
 for (var c=0; c<changes.length; c++) {
   var ch = changes[c];
   var current = new String(ch.innerHTML);
   etc.
 }

这适用于FF和Chrome,但不适用于IE7。大概是因为getElementsByName在IE中不起作用。什么是最好的解决方法?

7 个答案:

答案 0 :(得分:17)

如果你不知道为什么这在IE中不起作用,这里是the MSDN documentation on that function

  

使用getElementsByName方法时,将返回文档中具有指定NAME属性或ID属性值的所有元素。

     

支持NAME属性和ID属性的元素包含在getElementsByName方法返回的集合中,但具有NAME expando的元素不包含在集合中;因此,此方法不能用于按名称检索自定义标记。

Firefox允许getElementsByName()检索使用NAME expando的元素,这就是它工作的原因。这是否是一件好事可能有争议,但这就是它的现实。

因此,一个选项是使用getAttribute() DOM方法来请求NAME属性,然后测试该值以查看它是否是您想要的,如果是,则将其添加到数组中。但是,这需要您遍历页面中的所有节点或至少在子部分内迭代,这不是最有效的。您可以使用类似getElementsByTagName()之类的东西预先约束该列表。

另一种方法是,如果你控制页面的HTML,就是给所有感兴趣的元素提供一个仅由数字变化的Id,例如:

<div id="Change0">...</div>
<div id="Change1">...</div>
<div id="Change2">...</div>
<div id="Change3">...</div>

然后像这样使用JavaScript:

// assumes consecutive numbering, starting at 0
function getElementsByModifiedId(baseIdentifier) {
    var allWantedElements = [];
    var idMod = 0;
    while(document.getElementById(baseIdentifier + idMod)) { // will stop when it can't find any more
        allWantedElements.push(document.getElementById(baseIdentifier + idMod++));
    }
    return allWantedElements;
}

// call it like so:
var changes = getElementsByModifiedId("Change");

当然,这是一个黑客行为,但它可以完成你需要的工作,与其他一些黑客相比不会太低效。

如果您正在使用某种类型的JavaScript框架/工具包,那么您的选项要好得多,但我没有时间进入这些细节,除非您表明您正在使用它。就个人而言,我不知道人们如何在没有人的情况下生活,他们会节省很多时间,精力和挫折感,而你却买不起 使用它。

答案 1 :(得分:4)

有几个问题:

  1. IE确实让id=""name=""
  2. 混淆 {li} name=""不允许<span>

    为了解决问题,我建议:

    1. 将所有name=""更改为class=""
    2. 像这样更改您的代码:
    3. -

      var changes = document.getElementById('text').getElementsByTagName('span');
      for (var c=0; c<changes.length; c++) {
       var ch = changes[c];
      
       if (ch.className != from)
      continue;
      
       var current = new String(ch.innerHTML);
      

答案 2 :(得分:2)

使用NAME属性查找元素并不常见。我建议切换到ID属性。

但是,您可以使用jQuery找到具有特定名称的元素:

 $("*[name='whatevernameYouWant']");

这将返回具有给定名称的所有元素。

答案 3 :(得分:1)

IE中支持

getElementsByName,但存在错误。特别是它返回'id'与给定值匹配的元素,以及'name'。如果没有更多的上下文,代码和实际的错误信息,你无法判断这是否是你所遇到的问题。

通常,最好避免使用getElementsByName,因为HTML中的“name”属性有几个重叠的目的,这可能会造成混淆。使用getElementById更可靠。在专门处理表单字段时,您可以更可靠地使用form.elements [name]来检索您正在查找的字段。

答案 4 :(得分:1)

答案 5 :(得分:1)

我成功使用包装器返回元素数组。适用于IE 6和7。请记住,它不是100%与document.getElementsByName完全相同的东西,因为它不是NodeList。但是对于我需要它,它只是在一个元素数组上运行for循环来做简单的事情,比如设置.disabled = true,它运行得很好。

即使此函数仍使用getElementsByName,但如果以这种方式使用它也可以。亲眼看看。

function getElementsByNameWrapper(name) {
  a = new Array();

  for (var i = 0; i < document.getElementsByName(name).length; ++i) {
    a.push(document.getElementsByName(name)[i]);
  }

  return a;
}

答案 6 :(得分:1)

解决方法

                var listOfElements = document.getElementsByName('aName'); // Replace aName with the name you're looking for
            // IE hack, because it doesn't properly support getElementsByName
            if (listOfElements.length == 0) { // If IE, which hasn't returned any elements
                var listOfElements = [];
                var spanList = document.getElementsByTagName('*'); // If all the elements are the same type of tag, enter it here (e.g.: SPAN)
                for(var i = 0; i < spanList.length; i++) {
                    if(spanList[i].getAttribute('name') == 'aName') {
                        listOfElements.push(spanList[i]);
                    }
                }
            }