1

На сайте есть див, который либо содержит картинку, либо нет. И внутри дива есть текст "x " -- а дальше количество (которое нужно как-то достать оттуда).

Пример кода с img:

<div class="fixed-class">
<img src="https://site.com/randomimage.svg" class="fixed-class2">
"x "
"1"
</div>

Пример кода без img:

<div class="fixed-class">
"x "
"150"
</div>

Нужно с помощью JavaScript получить количество (в примерах это 1 или 150). Название классов фиксированное, его можно использовать.

Пробовал что-то такого типа:

var quantity = document.querySelectorAll(".fixed-class:last-of-type"); //пытался получить значения последнего элемента
alert (quantity); // [object NodeList]
if (quantity)
var totalQuantity = Number(quantity.innerHTML); //пытался привести значение элемента к числу
alert (totalQuantity); // NaN

Выходит какая-то ерунда. Посоветуйте, как тут лучше выкрутиться?

4
  • вас не смущает что innerHTML это текст? 20 сен 2021 в 1:16
  • Хмм, такой код у меня работает: let itemPriceSelector = ".css-price"; var price = document.querySelector(itemPriceSelector); if (price) var totalPrice = Number(price.innerHTML.slice(4));
    – Ya_O
    20 сен 2021 в 1:19
  • почитайте тутhttps://developer.mozilla.org/ru/docs/Web/API/Element/innerHTML а вам нужен alert (quantity.length); 20 сен 2021 в 1:25
  • про .length ошибся. к вашей задаче это не относится 20 сен 2021 в 1:33

2 ответа 2

3

При той структуре, которая заявлена в вопросе, можно просто получить текст, удалить из него все "НЕ цифры" (\D) и преобразовать в число:

let quantity = document.querySelectorAll('.fixed-class');

quantity.forEach(function(el) {
  let totalQuantity = parseFloat(el.textContent.replace(/\D/g, ''));
  console.info(totalQuantity)
});
<div class="fixed-class">
<img src="https://site.com/randomimage.svg" class="fixed-class2">
"x "
"1"
</div>

<div class="fixed-class">
"x "
"150"
</div>

1
  • 1
    Спасибо, так всё работает!
    – Ya_O
    20 сен 2021 в 13:18
2

Как пример

let fixed = document.querySelectorAll('.fixed-class');

fixed.forEach(function(e,i) {
  let num = e.innerHTML.match(/(?!<)"(\d+)"(?!>)/gim)[0];
  num = num != null ? Number(num.replace(/("|')/g, '')) : num;
  console.info(num, typeof num)
});
<div class="fixed-class">
"x "
"150"
</div>

<div class="fixed-class">
<img src="">
"123"
</div>

<div class="fixed-class">
<img src="" width="123">
"32"
</div>

2
  • Это более продвинутый вариант с защитой от цифр в коде. У меня их вроде как не предвидится в html-коде, так что воспользуюсь предыдущим ответом, но отдельное спасибо за этот более универсальный ответ! На самом деле я уже вижу, что мне что-то похожее пригодится чуть позже.
    – Ya_O
    20 сен 2021 в 13:23
  • @Ya_O, не за что)
    – De.Minov
    20 сен 2021 в 15:03

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.