сцепление с использованием getElementsByClassName и getElementById в JavaScript

Question

Следующий код JavaScript выдает ошибку

Uncaught TypeError: Object #<HTMLSpanElement> has no method 'getElementById'

Если это не разрешено, как мне найти существование определенного элемента внутри другого элемента?

var googlePlusPosts = document.getElementsByClassName("mo fj");

for (var i = 0; i <  googlePlusPosts .length; ++i) {
        decryptElements = googlePlusPosts[i].getElementById('decrypt-button');
.
.
.

Answer 1

getElementById не является частью интерфейса Element, это часть интерфейса Document.http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-getElBId

, поэтому получить элементы по идентификатору можно только по телефону document.getElementById.Это полностью правильно в спецификации, так как в документе может быть только один элемент с указанным идентификатором, поэтому я на самом деле чувствую, что проблема в вашем коде для начала (похоже, у вас более одногоэлемент с идентификатором «decrypt-button»).

Что касается цепочки, если вы можете быть уверены, что находитесь в браузере с интерфейсом querySelector, вы можете сделать googlePlusPosts[i].querySelector('#decrypt-button');, что по-прежнему неверно, как следуетиспользовать класс вместо идентификатора и иметь .decrypt-button

Answer 2

При условии, что вы хотите охватить старые браузеры, которые не поддерживают .querySelector(), и вы не используете какую-либо инфраструктуру / библиотеку, в которой уже есть встроенный метод, способ проверить, содержит ли конкретный элемент другой элемент,написать свою собственную функцию, которая использует .parentNode, примерно так:

function isDescendant(p, c) {
   while (null != (c = c.parentNode))
      if (p === c)
         return true;

   return false;
}

// then, from your code:

var decryptButton =document.getElementById("decrypt-button");
for (var i = 0; i <  googlePlusPosts .length; ++i)
   if (isDescendant(googlePlusPosts[i], decryptButton))
      // do something

Answer 3

В современных браузерах , вы можете использовать querySelector:

googlePlusPosts[i].querySelector("#decrypt-button")

В противном случае вам лучше всего использовать фреймворк.

Answer 4

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

Вы можете использовать element.getElementsByClassName, чтобы получить дочерние элементы определенного класса, или element.getElementsByTagName, чтобы получить их по имени тега.

РЕДАКТИРОВАТЬ: игнорировать ниже; только что сохраненный для потомков.

Проверьте, есть ли у элемента метод getElementById раньше времени.

if (foo.getElementById) {
  foo.getElementById("bar");
}