Question

我有多个具有相同id ='mydiv'的div元素。我想使用代码计算这些div和Iam

document.getElementById('mydiv').length

但它不起作用

Answer 1

你应该做的是使用class而不是ID。 ID仅适用于一个元素，类适用于多个元素。

http://jsfiddle.net/d7AHV/

Answer 2

它将无效，因为getElementById将始终返回具有指定ID的元素，如果指定的ID不存在，则返回null

来自ECMA

 getElementById(elementId) This method returns a Element. The elementId
    parameter is of type DOMString.

你可以做的是为每个div分配类

<div class="mydiv"></div>
<div class="mydiv"></div>
<div class="mydiv"></div>
<div class="mydiv"></div>
<div class="mydiv"></div>

迭代：

var divs = document.getElementsByTagName('div');
var count = 0;
for(var i = 0; i < divs.length; i++) {
    if(divs[i].className == 'mydiv') count++;
}

alert(count);

如果您的客户支持document.getElementsByClassName()，则更简洁：

alert(document.getElementsByClassName('mydiv').length)

Answer 3

您被告知有多个具有相同ID的元素，但在极少数情况下，它可能是不可避免的（例如，您无法控制的XML文档）。唯一不利的行为是，通过ID选择通常只返回第一个（但不保证）。

您可以通过循环文档中的所有元素并计算具有匹配ID的元素来计算具有相同id的元素，例如

function countSameIds(id) {
  var allNodes = document.getElementsByTagName('*');
  for (var i=allNodes.length, count=0; i; ) {
    if (allNodes[--i].id == id) {
      ++count;
    }
  }
  return count;
}

用js计算html元素的数量

3 个答案: