Question

让我们说我的代码是：

<div id="divname">

    <span></span>
    <span></span>
    <span></span>
    <span></span>

    <span></span>
    <span></span>
    <span></span>
    <span></span>

    <span></span>
    <span></span>
    <span></span>
    <span></span>

    <span></span>
    <span></span>
    <span></span>
    <span></span>

</div>

现在，我如何使用javascript进行此操作？

<div id="divname">

    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <div class="onclick"></div>
    <div class="hidden">
        <span></span>
        <span></span>
        <span></span>
        <span></span>

        <span></span>
        <span></span>
        <span></span>
        <span></span>

        <span></span>
        <span></span>
        <span></span>
        <span></span>
    </div>
</div>

简而言之，我想在特定数量的span标签之后插入标签，然后创建其余span标签的父级。然后，当单击带有onclick类的div时，隐藏的div将被删除，然后在该父div中再次覆盖较少的span标记。

如有任何疑问，请与我联系。

Answer 1

我首先使用:gt选择器来包装跨度：

var $newDiv = $("#divname > span:gt(3)").wrapAll($("<div>").addClass("hidden"));

然后在生成的div之前执行插入：

$("<div>", { class: "onclick" }).insertBefore($newDiv.parent());

Example jsFiddle和一个with CSS（谢谢kpull1）

如何在某些标签（数字）之后插入Div并创建其余的父级？

1 个答案: