jQuery 追加顺序

标签 jquery append

虽然很简单,但我就是不明白为什么这不起作用。

我需要将一个 div append 到文档正文,然后再次添加相同 div 的副本但隐藏,然后添加另一个 div,然后再次添加另一个相同 div 的副本但隐藏,依此类推...

    $.each(myObj.items, function(i, item) {

        // createItem simply finds an html fragment in the document,
        // clones it and returns it
        var $i = createItem(item);

        // add a div first that clears floats - this is needed before every item
        $('body').append('<div class="clear"/>');

        // append a clone of the html fragment
        $('body').append($i.clone());

        // add another div that clears floats
        $('body').append('<div class="clear"/>');

        // append a clone of the html fragment but hide it
        $('body').append($i.clone().addClass('hidden'));

    });

我期待:

    <body>
        <div class="clear"/>
        <div class="item">item</div>

        <div class="clear"/>
        <div class="item hidden">item</div>

        <div class="clear"/>
        <div class="item">item</div>

        <div class="clear"/>
        <div class="item hidden">item</div>
        ...
    </body>

但是我明白了..

    <body>
        <div class="clear"/>
        <div class="item">item</div>

        <div class="clear"/>
        <div class="item">item</div>

        <div class="clear"/>
        <div class="item hidden">item</div>

        <div class="clear"/>
        <div class="item">item</div>

        <div class="clear"/>
        <div class="item hidden">item</div>
        ...
    </body>

为什么第一个会跳过?

编辑

我的源 html 是这样的:

    <html>
        <body>
            <div class="template hidden">..</div>
        </body>
    </html>

我克隆模板 div,将其返回到我的函数,添加一个 div (class='clear'),然后添加返回的 div 的克隆,然后添加另一个 div (class='clear'),然后添加返回的另一个克隆分区

我的列表中的项目不超过 5 个。

编辑2

愚蠢的用户错误...代码工作正常。我没有意识到我的第一行是硬编码的而不是自动生成的。

对不起大家...(感觉很愚蠢)

最佳答案

您是否正在克隆一组现有的 div? IE。您的页面上已经有一个克隆,因此您的函数会克隆并添加一个常规克隆,然后添加另一个隐藏克隆。

关于jQuery 追加顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6060657/

相关文章:

r - 如何将命名向量作为一行添加到数据框中,并根据列名顺序重新排序?

Jquery Remove() 不删除选定的节点

javascript - 如何在 append 的 div 中 append 带有关联数据的迭代数组

javascript - 无法通过ajax调用 "No ' Access-Control-Allow-Origin'"从数据库获取数据

javascript - 如何使用 CSV 文件内容创建嵌套菜单

jquery - each() 切换复选框 append 此值 else if 语句在 jQuery

mysql - 根据Mysql中同表上的Another一列更新列数据

javascript - 无法在 Gauge Highchart 中设置目瞪口呆

javascript - 是否可以在没有 HTTP 请求或 &lt;input&gt; 的情况下从 HTML 应用程序目录中检索文本文件?

jquery - CSS 下拉菜单、z-index、iframe 有问题吗?