@1233211

Как взять html элемент и обернуть его своим div?

<div class='root'>
  <div class='root-header'>
    1
  </div>
  <div class='root-content'>
    2
  </div>
</div>


Нужно, чтобы получилось так

<div class='root'>
  <div class='root-header'>
    1
  </div>
  <div class='myClass'>
    <div class='root-content'>
      2
    </div>
  </div>
</div>


Доступа к html коду нет, нужно взять взять при помощи какого-нибудь селектора типа querySelector и обернуть в нужный див.
  • Вопрос задан
  • 64 просмотра
Решения вопроса 2
Stalker_RED
@Stalker_RED
const wrapper = document.createElement('DIV') // создаем обертку
wrapper.className = 'myClass' // с классом

const target = document.querySelector('.root-content') // ищем целевой див

target.insertAdjacentElement('afterend', wrapper) // вставляем обертку сразу после цели
wrapper.appendChild(target) // перемещаем целевой внутрь обертки
Ответ написан
@jenya92
Можно вот так:
<!DOCTYPE html><html lang="ru">
<head>
<meta charset="UTF-8">
<title>test</title>
<script>
document.addEventListener('DOMContentLoaded', function() {
    let NawCont = document.getElementById('root'); // Получаем текущие блоки
    let NewDiv = document.createElement('div'); // Создаём новый блок
    NewDiv.className = "NewClassEl"; // Добавляем новому блоку класс
    NewDiv.appendChild(NawCont); // Вставляем в новый блок контент
    document.body.appendChild(NewDiv); // Вставялем это всё на страницу
});
</script>
</head>
<body>
    <div id="root">
        <div class="root-header">
          1
        </div>
        <div class="root-content">
          2
        </div>
    </div>
</body>
</html>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы