javascript - jQuery .prepend 反转了数组?

标签 javascript jquery

我有一个对象数组,我从中抓取图像并显示在页面上,仅显示一次,最后一个首先显示,第一个向后显示。如果我使用 .append() 那么它的顺序是正确的,但从语义上讲我需要使用 .prepend() 以便我的 html 元素正确显示。对正在发生的事情有什么建议吗?我无法在网上找到任何关于导致此问题的原因。描述此行为的文档链接也很棒!

这是 jQuery 代码:

for (var i = 0; i < skills.length; i++) {
    var icon = '<img id="' + items[i].id + '" class="item-img-lg" data-toggle="modal" data-index="'+ i +'"src="' + items[i].iconurl + '" />';
    $('#items-large').prepend(icon);
};

最佳答案

Prepend 不会反转数组。在第一个循环中,您的第一个技能将添加到 #items-large 的前面。这很好,因为您可能希望第一个图标成为大项目上的第一个图标!但是,在第二次循环期间,第二个图标将添加到 #items-large 的前面(前置)。啊!现在第一个图标实际上是最后一个,第二个图标是第一个!对所有图标重复此操作,最后,数组中的最后一个图标位于前面或第一个,数组中的第一个图标位于后面或最后一个。

并且根据 #items-large 中的其他内容,您可能也不想使用追加。

想象一下以下情况:

<div id="items-large">
<!-- prepended icons go here -->
    <h1>My awesome icons</h1>
<!-- appended icons go here -->
</div>

追加仍然会导致图标顺序不正确!

您足够聪明,知道从这里该做什么,但如果您需要解决方案:

You could reverse your icons in the array by hand, or you could call reverse() on your array before you begin prepending them.

关于javascript - jQuery .prepend 反转了数组?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39840728/

相关文章:

javascript - 如何使动画进度条连续?

javascript - 为什么在下面的 Node js 程序中,S 函数中的第一个 for 循环会无限运行?

javascript - Cloudinary - 直接删除、jquery文件上传、隐藏字段

javascript - 将复杂的字符串转换为整数?

javascript - Angular Material md-select 不绑定(bind)

javascript - 更新 jQuery 中 data-attr 的值

javascript - 动态表单选择输入计算无法与 div 正常工作

javascript - 如何使用变量获取元素的 CSS 信息?

asp.net - 无法访问 wcf 服务中的 asp.net session

javascript - jquery live search - 修改行为