Получение ссылки на множество элементов, имеющих одинаковый идентификатор, используя Javascript

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-фрагмент находится где-то в коде ... Я должен собрать все теги, имеющие идентификатор элемента.

Как мне добиться этого в JavaScript?

getElementById позволяет мне получить только один элемент...

Более того, я не могу дать вам другую гипотезу ... Я имею в виду, что не могу полагаться на параметр класса и на параметр имени (я имею в виду, что все они - div-ы, так что ...).* Спасибо

Answer 1

Недопустимо иметь более одного элемента с одним и тем же идентификатором - вам следует переосмыслить свой дизайн, чтобы можно было назначать уникальные идентификаторы для каждого DIV.

Если вы все еще хотите это сделать (но не делайте этого), вы можете назначить внешнему DIV ID и получить список всех дочерних DIV, например:

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

Answer 2

Примечание. Каждому флажку также присваивается одинаковое имя, например name = 'element', затем попробуйте этот код JavaScript

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

it * /

http://rkj2me.blogspot.com/

Answer 3

Вы можете получить все div, как это

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

Answer 4

Если вы сталкиваетесь с чем-то вроде этого:

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

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

и хотите получить доступ к данным в <div id="element">2</div>, тогда используйте $("#b #element").html(); через jquery.

Answer 5

Если необходимо, попробуйте что-то вроде этого (с jQuery) $("div[id='element']"), но вам действительно следует избегать использования одного и того же id для более чем одного элемента на странице.

Быстрый пример подтверждает этоработает с jQuery 1.4.4: jsFiddle , но, опять же, это не очень хороший дизайн.

Answer 6

Как утверждают все, наличие нескольких элементов с одинаковым идентификатором является плохим дизайном, и следует стараться избегать таких сценариев в максимально возможной степени.Если по-прежнему есть необходимость, и вы действительно должны спасти Землю от инопланетного вторжения, тогда вы можете использовать функцию 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>

Теперь, когда вы можете получить уникальный доступ к индексу массива, вы можете получить уникальный доступ к элементам с одинаковым идентификатором (в данном случае)!

Answer 7

похоже, что ВЫ МОЖЕТЕ получить все элементы с одинаковым идентификатором, пример:

<!-- 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

Надеюсь, это поможет =)