Использование метода Map Создание массива переменных JS с помощью набора данных из HTML-варианта woocommerce - PullRequest
0 голосов
/ 23 октября 2019

Это HTML, который на самом деле представляет собой выпадающий вариант продукта woocommerce:

<select id="license_type" class="license_type" name="license_type" data-attribute_name="attribute_pa_services" data-show_option_none="yes">
  <option value="">Select an Option</option>
  <option value="5-site-license" data-price="129" class="attached enabled">5 Site License</option>
  <option value="developerslicense" data-price="1499" class="attached enabled">Developers License</option>
  <option value="single-site-license" data-price="69" class="attached enabled">Single Site License</option>
</select>

Изначально в vanilla JS массив цен с жестким кодом выглядел следующим образом: *

// var prices = [59, 236, 1475];

Остальная часть кода здесь:

var SelectDropDown= document.querySelectorAll("license_type");
  var options = Array.from(SelectDropDown);
  console.log(options);
  const getPrice = (option) => option.dataset.price;
  const toNumber = (strPrice) => Number(strPrice);
  const prices = Array.from(options).map(toNumber);
  console.log(prices);

Цель: нам нужно создать массив из data-price, который будет получать значения динамически на основе каждой отдельной страницы продукта.

Aздесь было дано другое рабочее решение: Создать массив переменных JS с помощью набора данных из HTML-варианта woocommerce

Но я ищу другие способы изучения . Я пытаюсь сделать то же самое с помощью метода map .

Проблема заключается в том, что эти журналы консоли генерируют пустые массивы:

enter image description here

Похоже, я не могу подобрать значение через data-price.

...