Как скопировать значения внутри тега элемента с помощью кнопки?

Question

[kpa18]

Добрый день,
необходимо скопировать часть значения элемента по тегам внутри, а именно сумму, заключенную в тег <b></b>, и адрес, заключенный в тэг <i></i>.
Сумма и адрес генерируются шаблонизатором и нет возможности добавить id в теги <b> и <i>.
Сумму нужно скопировать без слова rub.

<div class="form" id="invoice_form">Send <b>1000 rub</b> to <i>4279380040001111</i></div>

Заранее благодарю за ответы.

Comments

[Дмитрий Беляев]

а где Ваши попытки разобраться? что не получается то?

Answer 1

[Aza Broflovski]

Например, вот так

function getFormData(selector) {
  const form = document.querySelector(selector)
  const price = form.querySelector('b')
  const location = form.querySelector('i a')
  
  const [sum, currency] = price.innerText.split(' ')
  const address = location.innerText
  
  return {
    address,
    amount: {
      sum: +sum,
      currency,
    }
  };
}

const data = getFormData('#invoice_form')

console.log(data);

Результат консоль лога:

{
    "address": 4279380040001111,
    "amount": {
        "sum": 1000,
        "currency": "rub"
    }
}

+ можешь повторно использовать функцию, если таких форм много

Comments

[kpa18]

Я правильно понимаю что для содержимого тега <i> надо будет повторить это?

[Aza Broflovski]

kpa18, я правильно понимаю, что <b> и <i>, они всегда будут? и у них всегда будет такое содержимое? у одного число_валюта у другого число

[Aza Broflovski]

kpa18, обновил ответ, посмотрите ещё раз

[kpa18]

Aza Broflovski, да, все верно

[kpa18]

Aza Broflovski, на codepen консоль пустой лог выдает.

[Aza Broflovski]

kpa18,

на codepen консоль пустой лог выдает.

Проверил, работает, может у вас не загрузилось?

Answer 2

[Алексей Дубровин]

1)

document.querySelector('#invoice_form').querySelector('b').innerText.split(" ")[0]

2)

document.querySelector('#invoice_form b').innerText.split(" ")[0]