#javascript #nodelist
#javascript #список узлов
Вопрос:
Мне нужно извлечь определенное свойство данных из NodeList
. У меня нет проблем с получением данных из массивов или объектов в целом, но это NodeList
выше моих сил! Это не работает, даже если я использую Array.from()
, чтобы превратить его в массив.
Это соответствующий код:
И это то, что он регистрирует:
В журнале в строке 173 закрытые массивы содержат все необходимые мне данные, но я просто не понимаю, как туда попасть. Когда я пытаюсь перейти к индексу, он просто открывает координаты пути.
Я также добавлю изображение кода в виде текста, хотя в нем нет строк:
let test = d3.selectAll(".unit")
console.log(test)
console.log(test._groups)
console.log(test._groups[0])
console.log(test._groups[0][0])
РЕДАКТИРОВАТЬ: чтобы быть более конкретным, данные, которые мне нужны, — это свойство «data» внутри массива под списком узлов (?), Сравните с предыдущим изображением журнала в строке 173:
РЕДАКТИРОВАНИЕ 2: чтобы быть еще более понятным: когда я открываю список узлов в консоли, я также получаю массив, и меня интересует только массив. Я не понимаю эту структуру данных, как массив связан со списком узлов, но я пытался получить доступ к индексам массива различными способами, и ничего не сработало.
Комментарии:
1. Какие именно данные вам нужны? В последней строке показан элемент path, который содержит массивы.
2. Я отредактировал сообщение и добавил более конкретное изображение внизу. Сейчас я проверю ответы ниже, чтобы узнать, поможет ли это мне.
3. Это свойства элемента
test._groups[0][0]
, которые содержат эти данные. Например.console.log(test._groups[0][2].ariaAtomic)
печатает первое свойство, показанное на скриншоте.4. Нет, test._groups[0][0] — это именно то, что я пробовал выше, и он выводит только путь с координатами. test._groups[0][2].ariaAtomic выдает ошибку «Ожидал назначения или вызова функции, а вместо этого увидел выражение».
Ответ №1:
NodeList
объекты представляют собой наборы узлов. В некоторых случаях NodeList
он активен, что означает, что изменения в DOM автоматически обновляют коллекцию. В других случаях NodeList
является статическим, когда любые изменения в DOM не влияют на содержимое коллекции. document.querySelectorAll()
NodeList
Например, метод возвращает статическое значение.
Можно перебирать элементы в списке узлов, используя цикл for:
for (let i = 0; i < myNodeList.length; i ) {
let item = myNodeList[i];
}
for...of
циклы будут правильно перебирать объекты списка узлов:
const list = document.querySelectorAll('input[type=checkbox]');
for (let checkbox of list) {
checkbox.checked = true;
}
Вы можете использовать метод item(), чтобы получить элемент по его индексу. Например, вот как вы можете получить id
первое <div>
на какой-либо странице:
document.querySelectorAll("div").item(0).id
В вашем случае у вас есть массив, и он содержит элемент типа NodeList
.
Итак, когда вы это делаете test._groups[0]
, вы получаете первый элемент вашего массива, и этот элемент есть NodeList
, и вам нужно работать с ним, как с NodeList (см. Выше)! Например:
const arr = [1,2]; // simple array
// arr[0] is 1.
// in your case you have an array, but elements in that array are of type NodeList
// (that's why console shows something like [NodeList(...)])
// when you get something from your array - it will be NodeList
// hence you can iterate over it or get some particular item like
test._groups[0].item(0).ariaAtomic
Есть гораздо более полезные методы. Более подробную информацию см. в документах.
Комментарии:
1. Спасибо, но в моем случае это не работает, см. Правки в моем исходном сообщении.
Ответ №2:
Чтобы извлечь данные из списка узлов, вы должны зациклить свой список узлов и стандартные элементы списка узлов на другой вкладке
var list = node.childNodes;
// Using for..of
for(var value of list.values()) {
console.log(value);
}
[check this link https://developer.mozilla.org/en-US/docs/Web/API/NodeList/values][1]
Комментарии:
1. В моем случае это не работает, см. Правки в моем исходном сообщении.
Ответ №3:
Объекты списка узлов представляют собой наборы узлов.
Вы можете перебирать список узлов с помощью свойства NodeList.length и читать его innerHTML следующим образом.
И обратитесь к документу для получения дополнительных знаний
var items = document.getElementsByTagName("p");
var gross = "";
for (var i = 0; i < items.length; i ) {
gross = items[i].innerHTML;
}
а также вы можете перебирать
Комментарии:
1. Это не обычный список узлов, и приведенный выше пример, похоже, не работает … см. Правки в моем первоначальном сообщении.