Как скопировать текст из элемента и вставить его в другой через JS?

Question

Как скопировать текст из элемента .prcie-1 и вставить его в <span class="double-price"></span> через JS?

<strong class="price-1">2 999</strong>

<span class="double-price"></span>

Answer 1

document.querySelector('.double-price').textContent = document.querySelector('.price-1').textContent;

<strong class="price-1">2 999</strong>
<span class="double-price"></span>

Answer 2

Использование innerHTML - это конечно работает, но это не самый оптимальный вариант решения задачи.

Можно например так:

// Элемент из которого нужно копировать текст
const price1 = document.querySelector('.price-1');

// Элемент в который нужно копировать текст
const doublePrice = document.querySelector('.double-price');

// Текстовая нода из price1
const childNode = price1.childNodes[0];

// Клонируем текстовую ноду
const childClone = childNode.cloneNode(true);
    // у .cloneNode() есть один параметр - рекурсивное клонирование
    // true - клонировать ноду и все вложенные ноды
    // false - клонировать только эту ноду без детей

// Вставляем текстовую ноду в doublePrice
doublePrice.appendChild(childClone);

// ВСЁ!

// Кстати, если вставить ноду не клонируя,
doublePrice.appendChild(childNode);
// то вставленная в doublePrice нода пропадёт из price1

БЛОГ НА HUSL

Как скопировать текст из элемента и вставить его в другой через JS?

Ответы (2 шт):