jQuery insertAfter 不是一个函数

Posted 2023-05-09

【中文标题】jQuery insertAfter 不是一个函数

【英文标题】：jQuery insertAfter is not a function

【发布时间】：2019-11-06 02:53:12

【问题描述】：

我需要将元素插入到每个外部的 Dom 元素中：

$items1 = [];
$.each($('.qs-option-name'), function () 
   if($(this).find('span.highlighted').length === 1)
      $item  = $(this).parent().parent();
      console.log($item);
      $items1.push($item);
   
 );
 console.log($items1);
 $items1.insertAfter('ul li.first');

console.log() 里面的每个：

console.log() 外部为每个：

不确定再次循环插入数组是否有效有没有办法一次性插入一个 DOM 元素数组？

【参考方案1】：

问题是因为$items1 是一个jQuery 对象数组，因此没有insertAfter() 方法。

要解决这个问题，您可以从数组中创建一个 jQuery 对象：

$($items1).insertAfter('ul li.first');

您也可以使用add() 来组合 jQuery 对象，而不是创建一个基本数组：

var $items1 = $();
$('.qs-option-name').each(function() 
  if ($(this).find('span.highlighted').length === 1) 
    $item = $(this).parent().parent();
    $items1.add($item);
  
);
$items1.insertAfter('ul li.first');

但是，您可以使用:has() 和map() 使逻辑更简洁：

var $items1 = $('.qs-option-name:has(span.highlighted)').map(function() 
  return $(this).parent().parent();
).get();
$items1.insertAfter('ul li.first');

请注意，上面的内容略有不同，:has() 将匹配任何子项，不仅像您的原始实例那样匹配单个实例，而且考虑到似乎并不重要的区别的上下文。

【讨论】：

我也发现我可以使用prepend 但我给它尝试按照你的建议创建对象表单数组！