У меня есть серия p
наклеивает мою страницу, и я хочу перенести их всех в контейнер, например.
<p>foo</p>
<p>bar</p>
<p>baz</p>
Я хочу перенести все вышеупомянутые теги в контейнер следующим образом:
<div>
<p>foo</p>
<p>bar</p>
<p>baz</p>
</div>
Как перенести a NodeList
в элементе с помощью ванильного JavaScript?
Вы можете сделать это следующим образом:
// 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);
Если ваши целевые браузеры поддерживают это, 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);