Обертывание ряда элементов DOM с помощью JavaScript

У меня есть серия p наклеивает мою страницу, и я хочу перенести их всех в контейнер, например.

<p>foo</p>
<p>bar</p>
<p>baz</p>

Я хочу перенести все вышеупомянутые теги в контейнер следующим образом:

<div>
    <p>foo</p>
    <p>bar</p>
    <p>baz</p>
</div>

Как перенести a NodeList в элементе с помощью ванильного JavaScript?

32
задан 20 October 2014 в 03:57
поделиться

2 ответа

Вы можете сделать это следующим образом:

// create the container div
var dv = document.createElement('div');
// get all divs
var divs = document.getElementsByTagName('div');
// get the body element
var body = document.getElementsByTagName('body')[0];

// apply class to container div
dv.setAttribute('class', 'container');

// find out all those divs having class C
for(var i = 0; i < divs.length; i++)
{
   if (divs[i].getAttribute('class') === 'C')
   {
      // put the divs having class C inside container div
      dv.appendChild(divs[i]);
   }
}

// finally append the container div to body
body.appendChild(dv);
23
ответ дан 27 November 2019 в 20:30
поделиться

Если ваши целевые браузеры поддерживают это, document.querySelectorAll использует селекторы CSS:

var targets = document.querySelectorAll('.c'),
  head = document.querySelectorAll('body')[0],
  cont = document.createElement('div');
  cont.className = "container";
for (var x=0, y=targets.length; x<y; x++){
  con.appendChild(targets[x]);
}
head.appendChild(cont);
3
ответ дан 27 November 2019 в 20:30
поделиться
Другие вопросы по тегам:

Похожие вопросы: