У меня есть эта html-страница (внутри тега body) ->
<div class = "todo-container">
<ul class = "todo-list">
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
</ul>
</div>
Я пытаюсь запросить список .todo и хочу преобразовать innerText в массив. Я попробовал то, что сказано здесь, но не работает->
const nodelist = document.querySelector('.todo-list').innerText;
const nodelistToArray = Array.prototype.slice.call(nodelist);
console.info(nodelistToArray);
Но я получаю это в консоли ->
["I", "t", "e", "a", "s", "m", "↵", "I", "t", "e", "a", "s", "m", "↵", "I", "t", "e", "a", "s", "m", "↵", "I", "t", "e", "m", "↵", "I", "t", "e", "m", "↵", "I", "t", "e", "m", "↵", "I", "t", "e", "m"]
На самом деле я хочу что-то вроде этого ->
["Iteasm", "Iteasm", "Iteasm"]
Есть идеи ?? Спасибо !!!
Вместо этого используйте querySelectorAll
и Array.from
:
console.info(
Array.from(
document.querySelectorAll('.todo > li'),
li => li.textContent
)
);
<div class = "todo-container">
<ul class = "todo-list">
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Iteasm</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
<div class = "todo">
<li>Item</li>
</div>
</ul>
</div>
Большое спасибо CertainPerformance !!! Работало нормально!!!
вы также можете сделать это
const items = [...document.getElementsByClassName("todo")].map(li => li.innerText);
console.info(items);
Вы не можете поместить элемент
li
внутрьdiv
.div
внутриul
также запрещено. Пожалуйста, удалите всеdiv
внутри вашего кода.