Блог

Главная - Вопросы по программированию - Извлечение атрибута значения из фрагмента HTML

Извлечение атрибута значения из фрагмента HTML

#javascript #html

#javascript #HTML

Вопрос:

Я пытаюсь извлечь value свойство из HTML-файла. Раньше я querySelectorAll получал все узлы в файле. Может кто-нибудь, пожалуйста, помогите, как мне извлечь свойство только value из файла.

 const nodes = document.querySelectorAll("add")
console.log(nodes)  
 <div>
  <add value="abc"></add>
  <add value="def"></add>
  <add value="ghi"></add>
</div>

Комментарии:

1. Из файла или из элемента? Ваш контекст неясен. Существует несколько атрибутов value. Вы зацикливаетесь? Покажите свой код.

2. Вы понимаете, что <add> это недопустимый HTML?

3. add Часть была частью xml-файла. Для извлечения данных я добавил его в HTML-файл. @EmielZuurbier

Ответ №1:

Обязательно проверьте, что выбранные узлы имеют атрибут value , добавив [value] его в запрос.

Примечание: здесь я использую оператор расширения ES6 для получения списка узлов в виде массива.

 const nodes = document.querySelectorAll("add[value]")
console.log([...nodes].map(n => n.getAttribute("value")))  
 <div>
  <add value="abc"></add>
  <add value="def"></add>
  <add value="ghi"></add>
</div>

Ответ №2:

Вы можете использовать Array.prototype.map с Array.from :

 const nodes = Array.from(document.querySelectorAll("add")).map(el => el.getAttribute('value'))
console.log(nodes)  
 <div>
  <add value="abc"></add>
  <add value="def"></add>
  <add value="ghi"></add>
</div>

Ответ №3:

Вы можете сопоставить коллекцию узлов и вызывать getAttribute() каждый:

 const nodes = document.querySelectorAll('add');

const values = Array.from(nodes).map(node => node.getAttribute('value'));

console.log(values);  
 <div>
  <add value="abc"></add>
  <add value="def"></add>
  <add value="ghi"></add>
</div>