从 jQuery 选择中删除没有 id 的元素？

Posted 2023-03-05

【中文标题】从 jQuery 选择中删除没有 id 的元素？

【英文标题】：Removing elements without id from a jQuery selection?

【发布时间】：2012-02-20 12:20:55

【问题描述】：

如何从调用插件的集合（而不是 DOM 本身）中删除没有 id 属性的元素？

<span id="id737293" class="attach"></span>
<div class="attach"></span>

jQuery 调用和插件：

$('.attach').attach();

(function($) 

    $.fn.attach = function(options) 
       // Remove elements (without id) on which the plugin was invoked
       var valid = ???;

       // Loop each valid element (with id attribute) and process
       valid.each(function() 
       );

       return this; // Maintain chainability
    ;

)(jQuery);

【参考方案1】：

var elementsWithClassAttachAndHasId = jQuery(".attach:has([id])");
var elementsWithClassAttachAndNoId = jQuery(".attach:not([id])");

【讨论】：

我想这将从集合和 DOM 中删除，对吧？

看起来问题已被编辑，我现在将编辑我的答案以匹配。

【参考方案2】：

使用.filter 删除没有 ID 的元素。

(function($) 

    $.fn.attach = function(options) 
       // Remove elements (without id) on which the plugin was invoked
       var valid = this.filter(function()  return !!this.id; );

       // Loop each valid element (with id attribute) and process
       valid.each(function()                
       );

       return this; // Maintain chainability
    ;

)(jQuery);

$('.attach').attach();

http://jsfiddle.net/5Kn9W/2/

或var valid = this.not(':not([id])'); - http://jsfiddle.net/5Kn9W/1/

【讨论】：

太棒了。据我了解，这只会过滤选择而不影响 DOM 或可链接性，对吗？

@Gremo 是的，只有valid 变量会包含过滤后的元素列表。

没关系，但是过滤器函数应该返回有效元素（因此返回 this.id）......因为 jsfiddle 以红色显示无效元素；）

既然可以使用选择器，为什么还要使用过滤器？在这里使用函数似乎很愚蠢。

因为在插件内部你无法控制用于调用插件的选择器。

【参考方案3】：

 if(!$(elem).prop("id"))
   $(this).remove()

【讨论】：

这会破坏可链性吗？我的意思是我想循环选择的每个有效元素，但不从 DOM 本身中删除元素。

你只需要检查 if(!$("some element").prop("id")) 而不是做某事