JS выбрать дочерний элемент этого класса с определенным классом

Question

Я пишу сценарий GreaseMonkey, который проходит через страницу с различными элементами, и каждый элемент имеет текст и кнопку. Он использует document.getElementsByClassName для поиска родительских элементов и имеет цикл for, чтобы что-то сделать для каждого родительского элемента. В этом цикле мне нужно выбрать дочерний узел с определенным классом и найти его текстовое значение (innerHTML). Я не могу понять, как выбрать ребенка с определенным классом этого элемента.

Answer 1

Вы хотите, чтобы захватить текущий итерированный элемент и использовать querySelector()

Например:

var elements = document.getElementsByClassName('class'); 

for (var i = 0, len = elements.length; i < len; i++) { 
    var child = elements[i].querySelector('.class_of_desired_element'); 

    //do stuff with child 
} 

Примечания точки перед именем класса в querySelector как это работает подобно jQuery.

Answer 2

Вы можете использовать

var yourelement = document.getElementsByClass(""); 
var i = yourelement.nextSibling; 
var e = i.nextSibling; 

и продолжать получать nextSibling элемента, пока вы его получите.

Однако, как @teddy сказал в комментариях, я бы предложил вам использовать jQuery. Он имеет гораздо более простой способ сделать это:

var value = $('.parentClass .childClass').html(); 

Answer 3

Try querySelectorAll(), который можно использовать для поиска элементов в пределах текущего элемента.

var parent = document.getElementsByClassName('parentClass'), 
parent[0].querySelectorAll('.childClass'); 

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

document.querySelectorAll('.parentClass .childClass'); 

https://developer.mozilla.org/en-US/docs/Web/API/Element.querySelectorAll