如何在 jQuery 中保持 DRY？

Question

在 jQuery 中有没有办法保存常用的函数链供以后引用，以保持DRY 编码风格？

例如在下面的代码中我想引用链.closest('.row').closest('div').remove();：

$('#search-results .row .unsafe').closest('.row').closest('div').remove();
$('#search-results .warnings').closest('.row').closest('div').remove();
$('#search-results .textresults1:contains("Endpoint offline!")').closest('.row').closest('div').remove();
// lots more distinct selectors

类似这样的：

var bye = ".closest('.row').closest('div').remove()";

$('#search-results .row .unsafe').bye();
$('#search-results .warnings').bye();
$('#search-results .textresults1:contains("Endpoint offline!")').bye();
// more...

我的问题仅与以这种方式重用函数链有关 - 即 jQuery 是否有执行存储为变量中的字符串的函数链的方法。我很欣赏可以重写任何代码示例以避免对此的需要，但这是一个不同的问题。我认为可能有很多用例来存储像这样的常用函数链 - 例如可能用于复杂的样式/动画例程。

^{[我知道第一个选择器可以修改为包含所有后续选择器，但这样做是为了提高性能。 #search-results 包含数以万计的<div>，每个都包含十几个元素。这样，在前面的选择器已经杀死了几千行之后，最后完成了模糊搜索（即与:contains 匹配的松散文本）。此外，此特定代码取自我正在编写的 Greasemonkey 用户脚本，因此我无法选择直接在源服务器端删除这些虚假结果 - 这不是我的服务器/网站]}

Answer 1

基本封装就可以完美做到：

function removeStuff(selector) {
  return $(selector)
    .closest('.row')
    .closest('div')
    .remove();
}

从@Heretic Monkey 现已删除的评论中导出。

Answer 2

通过使用一个简单的插件，你可以像.bye()一样使用它

(function ( $ ) {
  $.fn.bye = function() {
    $(this).remove();
    //$(this).closest('.row').closest('div').remove();
  }
}( jQuery));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button>click</button>


<script>
  $(document).ready(function(){
     $('button').bye();
  });
</script>