javascript before - как копировать содержимое, перед которым добавляем?

Question

Подскажите, пожалуйста, как из этого:

<h2>Заголовок</h2>
<h2>Второй заголовок</h2>
<h2>Другой заголовок</h2>

Сделать это:

[tabby title="Заголовок"]<h2>Заголовок</h2>
[tabby title="Второй заголовок"]<h2>Второй заголовок</h2>
[tabby title="Другой заголовок"]<h2>Другой заголовок</h2>

То есть, не просто вставляем содержимое перед <h2>, но еще и копируем текст, который после h2 (у каждого свой) и размещаем его в [tabby title="XXXX"]. Не силён в этом, а нагуглить не получилось.

Answer 1

Метод .before может принимать функцию, которая возвращает то, что будет вставлено перед текущим элементом. При этом доступ к самому элементу можно осуществить через this.

Получить текст текущего элемента можно с помощью свойства .textContent

Таким образом код может быть следующим

$('h2').before(function() {
  return `[tabby title="${this.textContent}"]`;
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2>Заголовок</h2>
<h2>Второй заголовок</h2>
<h2>Другой заголовок</h2>

БЛОГ НА HUSL

javascript before - как копировать содержимое, перед которым добавляем?

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