如何从函数中删除jquery过滤器

Posted 2023-05-09

【中文标题】如何从函数中删除jquery过滤器

【英文标题】：how to remove jquery filter from function

【发布时间】：2016-11-18 00:19:06

【问题描述】：

我有一个要从中删除 jQuery 的函数：

var hunt = new RegExp(action.search);
$('a').filter(function() 
  return hunt.test(this.href);
).click(doStuff);

我正在尝试使用 vanilla javascript 重写此函数。这是我到目前为止所拥有的，但它不起作用

    var hunt = new RegExp(action.search);
    var aSelector = document.getElementsByTagName('a');
    var arr = Array.prototype.filter.call(aSelector, function(el)
        return hunt.test(el.href)
    );
    for(var i=0; i<arr.length; i++)
        var elem = arr[i].getAttribute('href');
        elem.onclick = function()
            doStuff();
        ;
    

我猜测 jQuery 选择器的行为与 document.getElementsByTagName 略有不同，但我真的不知道发生了什么。任何帮助将不胜感激。谢谢

【问题讨论】：

var elem = arr[i].getAttribute('href');获取每个元素的“href”属性值。然后，您尝试为返回的值分配一个点击处理程序。

规则#1：简单地说“不起作用”并不是写问题的好方法。有错误吗？预期与实际行为是什么？

【参考方案1】：

最好使用querySelectorAll() 而不是getElementsByTagName()，除此之外，我认为代码是不言自明的。询问是否有不清楚的地方

//a very basic utility to fetch Nodes by css-selectors and return them as an Array
//- shorthand for document.querySelectorAll()
//- document.querySelectorAll() returns a NodeList wich lacks the Array-methods
//- second argument to provide a Node as the context of the query
function $$(selector, context)
    return Array.from((typeof context === "object" && context || document).querySelectorAll(selector));


//now we can use the regular Array-methods
$$('a').filter(function(node)
    return hunt.test(node.href);
).forEach(function(node)
    node.addEventListener("click", doStuff);
)

或者这样：

$$('a').forEach(function(node)
    if(hunt.test(node.href))
        node.addEventListener("click", doStuff);
    
);