Question

假设有以下内容：

<div>
   <div id="element"></div>
   <div id="element"></div>
   <div id="element"></div>
   <div id="element"></div>
   <div id="element"></div>
   <div id="element"></div>
   <div id="element"></div>
</div>

确定。这个html片段放在代码中的某个地方...... 我必须收集所有具有元素id的标签。

我如何在javascript中实现这一目标？

getElementById允许我只检索一个元素......

此外我不能给你其他假设......我的意思是我不能依赖类参数和名字参数（我的意思是它们都是div，所以......）。

谢谢

Answer 1

拥有多个具有相同ID的元素是无效的 - 您应该重新考虑您的设计，以便为每个DIV分配唯一的ID。

如果您仍想这样做（但请不要这样做），您可以为外部DIV分配一个ID并获取所有子DIV的列表：

var list = document.getElementById('outerDiv').getElementsByTagName('div');

Answer 2

你可以得到像这样的所有div

var alDivs = document.getElementById("element").parentNode.getElementsByTagName("div");

Answer 3

注意：您还为每个复选框指定相同名称，例如name ='element' 然后试试这个javascript代码

var totalCheckBoxes=document.getElementsByName("element");
/*totalCheckBoxes is the array of all check boxes so implement further functionality upon

它* /

http://rkj2me.blogspot.com/

Answer 4

如果必须，尝试这样的事情（使用jQuery）$("div[id='element']")，但你真的应该尝试避免对页面上的多个元素使用相同的id。

一个简单的例子证实这适用于jQuery 1.4.4：jsFiddle，但同样，这不是一个好的设计。

Answer 5

如果您遇到这样的事情：

<div id="a">
   <div id="element">1</div>       
</div>

<div id="b">
   <div id="element">2</div>       
</div>

并且您想要访问<div id="element">2</div>中的数据，然后通过jquery使用$("#b #element").html();。

Answer 6

似乎你可以获得所有具有相同id的元素，例如：

<!-- the HTML: -->

<div id="div_lala" style="background-color:#FFFFFF;">
 some content 1111
</div>

<div id="div_lala" style="background-color:#FFFFFF;">
 some content 2222
</div>

然后是JS为他们做点什么的例子，比如改变他们的背景=）

function printElements() {

  bgcolors=new Array("#0066FF","#FF9900")

  elementCount = document.all("div_lala").length; //this will count all elements with the same name =)
  alert('there are: '+ elementCount + 'elements =)' ) //just to know how many elements

  for (i=0; i<elementCount; i++) {

        document.all("div_lala",i).style.background = bgcolors[i]; //we change the color of each element according to the ones in the array
  }
}

这个想法的来源：http://www.webreference.com/js/tips/000921.html

希望有帮助=）

Answer 7

正如大家所说，拥有多个具有相同id的元素是一个糟糕的设计，应尽量避免这种情况。如果仍然需要并且你必须真正拯救地球免受外来入侵，那么你可以使用 querySelectorAll 函数返回数组中具有相同属性值的所有元素，如下所示：

<div id="element"></div>
   <div id="element">A</div>
   <div id="element">B</div>
   <div id="element">C</div>
   <div id="element">D</div>
   <div id="element">E</div>
   <div id="element">F</div>
</div>
<script type='text/javascript'>
 var result = document.querySelectorAll("#element");
/*
 result[0] points to <div id="element">A</div>
 result[1] points to <div id="element">B</div>
 result[2] points to <div id="element">C</div>
 result[3] points to <div id="element">D</div>
 result[4] points to <div id="element">E</div>
 result[5] points to <div id="element">F</div> 
*/
</script>

现在您可以唯一地访问数组索引，您可以唯一地访问具有相同ID（在本例中）的元素！

使用Javascript引用具有相同id的许多元素

7 个答案: