Question

我正在尝试将一类添加到后缀以.pdf结尾的一堆链接中，如下所示：

var pdfs = jQuery("a[href$='.pdf']"); //Choosing .pdf links
pdfs.each(addClass("pdf")); // Adding the class

但是，这不起作用，因为当我尝试重新加载调用.js文件的HTML文件时，浏览器控制台会显示此错误：

ReferenceError：未定义addClass

为什么会这样？

Answer 1

jQuery使您不仅可以在单个元素上而且可以在元素集合上执行其API方法（这是与本机DOM API相比的一大优点）。

实现目标的最简单方法是利用：

var pdfs = jQuery("a[href$='.pdf']"); //Choosing .pdf links
pdfs.addClass("pdf"); // Adding the class

jQuery $.each()函数适用于您要对集合中的每个元素做某事的情况，这些元素在jQuery中无法作为API方法使用。期望您将其传递给函数，该函数在每次迭代中将当前元素传递为this：

var pdfs = jQuery("a[href$='.pdf']"); //Choosing .pdf links
pdfs.each(function() { console.log(this.href); }) // perform something jQuery doesn't offer as an API method

如果您坚持使用$.each()，则代码如下：

var pdfs = jQuery("a[href$='.pdf']"); //Choosing .pdf links
pdfs.each(function() { $(this).addClass("pdf"); }); // Adding the class

Answer 2

https://api.jquery.com/addClass/

选择pdf链接后，您可以直接在变量 pdfs 上调用addClass方法，因为这是一个jquery对象，并且该类将应用于所有链接。

var pdfs = jQuery("a[href$='.pdf']"); //Choosing .pdf links
pdfs.addClass("pdf"); // Adding the class

Answer 3

addClass(className)是DOM元素对象的一种方法。必须与元素对象一起调用。当我们在没有DOM对象引用的情况下调用addClass()时，它会寻找局部函数，从而引发引用错误。

var pdfs = jQuery("a[href$='.pdf']"); 
pdfs.each(function() {
  $(this).addClass( "foo" );
});

Answer 4

所以...整体来说：

$("a[href$='.pdf']").each(function () {
   $(this).addClass("pdf");
})

Answer 5

.each需要一个函数（delegate）来为jQuery结果的每一项调用它，但是func()（在这种情况下为addClass(..)）将调用addClass函数（当前作用域中未定义），并将调用结果传递给each函数。

您可以访问每个项目的addClass功能，如下所示：

pdfs.each(function(index, pdf){
   $(pdf).addClass(...);
});

或全部：

pdfs.addClass(...);

为什么在这种情况下addClass不能识别为函数？

5 个答案: