Как скопировать текст элемента в его data-атрибут?

Question

На сайте есть несколько элементов с классом js-data-content. Нужно придумать скрипт, который будет в каждом таком элементе брать его текстовый контент и вставлять его в атрибут data-content.

Например из:

<a class="js-data-content" href="#">Текст</a>
<p class="js-data-content">Lorem ipsum</p>

Сделать:

<a class="js-data-content" href="#" data-content="Текст">Текст</a>
<p class="js-data-content" data-content="Lorem ipsum">Lorem ipsum</p>

Answer 1

Можно так:

Выбираем все элементы с классом js-data-content с помощью querySelectorAll
Проходимся по всем элементам с помощью forEach
Достаём именно текстовое содержимое с помощью textContent
С помощью setAttribute устанавливаем значение аттрибуту data-content

document
  .querySelectorAll('.js-data-content')
  .forEach(element => {
    element.setAttribute('data-content', element.textContent);
  })

<a class="js-data-content" href="#">Текст</a>
<p class="js-data-content">Lorem ipsum</p>

БЛОГ НА HUSL

Как скопировать текст элемента в его data-атрибут?

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