Question

我做了很多搜索，但我觉得答案可能非常简单。

我有什么： jQuery从div获取列表项并将它们推送到一个数组中以附加到其他地方。

发生了什么：对象被推送到数组，但它们也会从DOM中删除。

我需要的是什么：要将它们推送到阵列，还要将原件保留在原来的位置。

以下是我用作参考的代码

  var leftItems = [];
  var rightItems = [];

  $('.footer-top li').slice(0,6).each(function(i) {
    leftItems.push(this);
  });

  $('.footer-top li').each(function(i) {
    rightItems.push(this);
  });

  $.each(rightItems, function(index, value) {
    $('.footer-menu-mob ul.right').append(this);
  });

  $.each(leftItems, function(index, value) {
    $('.footer-menu-mob ul.left').append(this);
  });

Answer 1

给定对象一次只能是DOM中的一个位置。因此，当您.append()数组中的项目时，您将它们移动到DOM中的新位置。如果您想要在新位置复制这些项目，那么您可以使用jQuery＆＃39; .clone()。

请参阅下面的注释，了解发生了什么：

 var leftItems = [];
  var rightItems = [];

  // this makes a nice array of DOM elements, nothing is removed from
  // the DOM here
  $('.footer-top li').slice(0,6).each(function(i) {
    leftItems.push(this);
  });

  // this makes a nice array of DOM elements, nothing is removed from
  // the DOM here
  $('.footer-top li').each(function(i) {
    rightItems.push(this);
  });

  // this MOVES these elements from their current location in the DOM to
  // a new location
  $.each(rightItems, function(index, value) {
    $('.footer-menu-mob ul.right').append(this);
  });

  // this MOVES these elements from their current location in the DOM to
  // a new location
  $.each(leftItems, function(index, value) {
    $('.footer-menu-mob ul.left').append(this);
  });

如果您不需要保留阵列，那么您可以使用.clone()并简化代码，如下所示：

  $('.footer-top li').slice(0,6).clone().appendTo('.footer-menu-mob ul.left');
  $('.footer-top li').clone().appendTo('.footer-menu-mob ul.right');

Answer 2

您需要克隆DOM元素。您还可以大大简化代码：

$('.footer-top li').each(function(index, value) {
    var targetSelector = '.footer-menu-mob ul.right';
    if(index > 6) {
        targetSelector = '.footer-menu-mob ul.left';
    }   
    $(this).clone().appendTo(targetSelector);
});

请注意，我假设您希望将前7个项目追加到.footer-menu-mob ul.right，将剩余项目追加到.footer-menu-mob ul.left，而您最初的切片方法将放置前7个元素右边和左边的所有元素。由于您重新指定了选择器。

将对象推送到数组而不从DOM中删除

2 个答案: