0

Queue我有以下代码，单击时会触发

$('#queue').click(function(){
        $("#feature").load("templates/queue.html", function(){
            var template = $('queue_item').clone();
            if (localStorage['queue'] == null) {
                $('.queue_list').append('<p>You have not added any video to the queue yet</p>');
            } else {
                var queue_list = JSON.parse(localStorage['queue']);
                for (var i = 0; i < queue_list.length; i++) {
                    console.log(queue_list[i]);
                    var item = fill_queue_item(queue_list[i]);
                    $('.queue_list').append(item).fadeIn('slow');
                }
            }
        });
    });
  • 根据items添加到队列中的用户数量，此代码创建一个节点并插入queue_list
  • 当我在 Firfox 上进行测试时，一切都很好，但 Safari 和 Chrome 几乎无法执行相同的操作

问题 - 我怎样才能让 Chrome 和 Safari 像 Firefox 一样快乐，让他们做事快？

更新

function fill_queue_item(data) {
    var template = $('.queue_item').clone();
    template.removeClass('hide-item');
    template.find('img').attr('src', data.thumbnail);
    template.find('.title').html(data.title);
    template.attr('id', data.url);
    template.addClass('view-item');
    return template;
}

可以包含任意数量的queue项目，但对于 Chrome/Safari，它不超过 20

4

1 回答 1

1

我建议改变：

var template = $('.queue_item').clone();

对此：

var template = $('.queue_item').first().clone();

你现在拥有它的方式，你正在克隆每一个.queue_item，所以当你添加越来越多时，你正在创建许多不必要的克隆，而你真的只是想每次创建一个新的克隆用作模板。如果您每次对先前的结果执行 20 次此操作，您最终可能2^20会得到超过一百万个对象的克隆元素。

于 2012-08-18T23:46:09.490 回答