Question

我想动态添加一对Div标签和一个类来包装DOM中的一组元素。我该怎么做呢？

HTML

<div class="right-bottom"> <!-- this is the div tag I would like to add to wrap the content below-->
    <li class="">
        <a href="">Diffusion Tensor Imaging</a>
        <article class="article-body" data-asynchtml-target="">
            <div class="loader"></div>
        </article>
     </li>

</div>

的JavaScript

<script type="text/javascript">
    var div = document.createElement('div');
</script>

Answer 1

您可以使用.wrap()和适当的选择器来定位li元素。像这样的东西：

$('.article-body').closest('li').wrap('<div class="right-bottom"></div>')

请参阅Documentation。

Answer 2

这是一个例子：get parent，detach元素，append wrap to parent，append element to wrap。

function wrapElement(element) {
    var parent = element.parentNode,
        wrap   = document.createElement('div');

    wrap.classList.add('wrap');
    element.remove();
    parent.appendChild(wrap);
    wrap.appendChild(element);
}

http://jsbin.com/hagovune/1/edit?html,css,js,output

添加Div标签以包裹LI元素

2 个答案: