【问题标题】:How to append li inside new div如何在新的div中附加li
【发布时间】:2013-04-13 17:58:26
【问题描述】:

我有一个这样的 HTML 标记:

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
    <li>Item 8</li>
</ul>

如何将上面的 HTML 转换成这个:

<div class="main"><ul><li>Item 1</li><li>Item 2</li></ul></div>

<div class="main"><ul><li>Item 3</li><li>Item 4</li></ul></div>

<div class="main"><ul><li>Item 5</li><li>Item 6</li></ul></div>

<div class="main"><ul><li>Item 7</li><li>Item 8</li></ul></div>

【问题讨论】:

  • 首先,您尝试过什么,然后我们会知道您是否在寻找 vanilla js、jquery、mootools 等

标签: javascript jquery html css list


【解决方案1】:

你可以这样做:

$('ul > li:nth-child(2n-1)').each(function() {
    $(this).next().add(this).wrapAll('<div class="main"><ul></ul></div>');
}).eq(0).closest('div').unwrap();

Working Demo

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-09-10
    • 1970-01-01
    • 2016-05-22
    • 1970-01-01
    • 2015-05-04
    • 2013-11-20
    • 1970-01-01
    相关资源
    最近更新 更多