jQuery insertAfter 不是一个函数

Question

我需要将元素插入到每个外部的 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 元素数组？

Answer 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() 将匹配任何子项，不仅像原始实例那样匹配单个实例，而且考虑到上下文似乎不存在重要区别.