使用JQuery查找和缓存元素

Question

我正在寻找元素下的所有<a>标记。 然后，我找到每个href标记的<a>，并获取具有这些ID的元素：

var links = element.find("a");
var panes = links.map(function () { 
    return $("#" + this.href.split("#")[1]); 
});

我将在我的代码中使用一个或多个链接和窗格。

1. 缓存这些元素的最佳方法是什么？ 我不确定我做得对。

2. 我在第一个链接和第一个窗格中添加了一个类：

   $(links[0]).addClass("active");  
   panes[0].addClass("active");  
   

   为什么我需要使用$(links[0])代替links[0]才能使其正常工作？

Answer 1

jQuery中的数组解除引用运算符（[]）模仿get()的行为，它返回一个HTML元素，而不是jQuery对象。

引用：

  

.get（）方法授予对每个jQuery对象下面的DOM节点的访问权限。

     

每个jQuery对象也伪装成一个数组，因此我们可以使用数组解除引用运算符来获取列表项：

     

console.log( $( "li" )[ 0 ] );

相反，你可以使用.eq()来返回jQuery对象。例如：

links.eq(0).addClass("active"); 

Answer 2

你困惑的根源是你处理两种不同的对象：

• jQuery个对象，特定于jQuery库。
• Node个对象的数组，它们是旧的DOM API的一部分。

我会引用文档：

  

jQuery对象包含文档对象模型（DOM）的集合   已从HTML字符串创建或从中选择的元素   文献。 [...]

     

jQuery对象本身就像一个数组;它有一个长度   属性和对象中的元素可以通过它们访问   数字索引[0]到[length-1] 。

因此links是jQuery的实例，但links[0]是Node的实例。括号是图书馆提供的便利包装。

（不知道您想了解有关缓存的内容。）