Javascript Как получить текст из div внутри списка li

martel_9 спросил: 28 апреля 2018 в 09:51 в: javascript

У меня есть список ul, внутри которого есть li, и внутри li текст и div есть. тот же класс присваивается li, а div назначается другим именем класса.

Я просто хочу получить текст из div, а не из li.

Просто нужно получить"Мне нужен этот текст 112" из div. Я пытаюсь:

li = ul.getElementsByTagName('li');

<ul class="category">
  <li class="hero" href="page1.htm">
    <a href="page1.htm"><img src="img/001.png" /></a>
    <div class="Hello">
      <a href="page1.htm">I need this text&nbsp;112</a>
    </div>
  </li>

Но это дает мне ошибку.


2 ответа

Есть решение
Jamiec ответил: 28 апреля 2018 в 09:59

Используйте querySelector, чтобы найти элемент из document или, если у вас уже есть ссылка на ul, вы можете использовать это как отправную точку .

var elem = document.querySelector(".category li div.Hello a");
// or var elem = ul.querySelector("li div.Hello a")
alert(elem.textContent)
<ul class="category">
<li class="hero" href="page1.htm">
    <a href="page1.htm"><img src="img/001.png"></a>
    <div class="Hello">
        <a href="page1.htm">I need this text</a>
    </div>
</li>
</ul>
Scott Hunter ответил: 28 апреля 2018 в 09:57
Какое-то объяснение, почему это работает, было бы неплохо.
martel_9 ответил: 28 апреля 2018 в 10:13
это дает мне сообщение об ошибке "Uncaught TypeError: Невозможно прочитать свойство" querySelector 'of null"
T.J. Crowder ответил: 28 апреля 2018 в 10:02

Вы можете использовать document.querySelector, передавая ему строку, содержащую любой допустимый селектор CSS, и он вернет ссылку на первый соответствующий элемент. Существует также Element#querySelector, который делает то же самое, когда ваша отправная точка является элементом (как кажется, ваш ul). Когда у вас есть элемент, textContent, вероятно, лучший способ получить текст сейчас, хотя вы также можете использовать innerText в некоторых браузерах. (Вы также можете использовать innerHTML - в любом браузере - если вы хотите HTML, а не только текст.) Так например:

text = ul.querySelector(".hello a").textContent;

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