Обновите два одинаковых значения в html одним ответом ajax

Question

У меня есть две <span> метки с одинаковым идентификатором в разных местах на моей странице. Я знаю, что неправильно использовать один и тот же идентификатор дважды. Для меня не проблема поменять ID на классы.

HTML:

<code><span id="tumme">4</span><br>
...<br>
<span id="tumme">4</span><br>
....

обновлено

AJAX:
document.getElementById(tumme).innerHTML = xmlHttp.responseText;

но только на <span> обновляется.

Есть идеи?

Answer 1

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

<span class="tumme"> 4 </span>

Затем, когда вы получите данные из вашего XHR-запроса, найдите все элементы и зациклите их. Хотя вы можете использовать свой собственный метод для получения элементов по имени класса, проще использовать существующий .

Цикл над ними будет только случай:

for (var i = 0; i < elements.length; i++) {
    elements[i].innerHTML = xmlHttp.responseText;
}

Answer 2

Измените id = на class =, потому что 2 элемента с одинаковым идентификатором НЕПРАВИЛЬНЫ *

Затем либо используя jQuery и его мощные селекторы, либо вот функцию , которую какой-то парень написал , чтобы получить все элементы по имени класса

Answer 3

С сайта W3C об идентификаторах (http://www.w3.org/TR/REC-html40/struct/global.html#h-7.5.2):

Этот атрибут присваивает имя элементу. Это имя должно быть уникальным в документе.

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

Answer 4

Используйте getElementsByClass:

function getElementsByClass(searchClass,node,tag) { var classElements = new Array(); if ( node == null ) node = document; if ( tag == null ) tag = '*'; var els = node.getElementsByTagName(tag); var elsLen = els.length; var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"); for (i = 0, j = 0; i < elsLen; i++) { if ( pattern.test(els[i].className) ) { classElements[j] = els[i]; j++; } } return classElements; }

Answer 5

Ну, вы можете использовать атрибут NAME. Вполне допустимо иметь несколько узлов с одинаковым ИМЯ.

Итак, у вас были бы эти узлы:

<span id="somethingUnique1" name="tumme"></span>
<span id="somethingUnique2" name="tumme"></span>

Чтобы обновить их, вы должны сделать что-то вроде:

var nodes = document.getElementsByName("tumme");
for (var i = 0, node; node = nodes[i]; i++) {
  node.innerHTML = xmlHttp.responseText;
}