Javascript 关于JQuery设计的困惑

我刚开始使用Jquery，我有以下理解：

Jquery的每个选择器都会返回一个包装好的项目列表，这些项目可以是

• 空名单
• 单元素列表
• 包含许多元素的列表

链式函数作用于整个列表，而不仅仅是一个列表

我的困惑是：

A.有些函数如何返回正确的值，即使它们在包含许多元素的列表上操作，例如数据（“某物”）

B.如果我们特别想对单个项目进行操作，我们应该怎么做

• 像正则数组一样迭代整个列表
• javascript的过滤功能
• 还有别的事（想不出来）

Jquery的每个选择器总是返回一个项目的包装列表

不仅当与选择器一起使用时，而且是的，jQuery对象（返回值

$（）

）是一组元素，具有作用于该集合的方法

（很少情况下，jQuery对象包含非元素的内容，例如如果从回调返回非元素，或者如果使用包含元素之外的文本和注释节点的返回值。但在绝大多数情况下，您处理的是元素。）

A.即使某些函数在包含许多元素的列表（例如

data（'something'）

）上运行，它们如何返回正确的值

很好的问题！API是不对称的。在大多数情况下，当您使用函数作为getter时，它从集合中的第一个元素获取；但当您将其用作setter时，它会设置集合中的所有元素。考虑：

var a = $("a");
console.log(a.attr("href"));                // Shows the href attr of the
                                            //  **first** element
a.attr("href", "http://stackoverflow.com"); // Sets the href attr of **all**
                                            // elements in the set

此规则的最大例外是，它返回集合中所有元素的文本，而不仅仅是第一个元素的文本。为什么？呃……问问约翰·雷西格（John Resig）：-）就是这样

B.如果我们特别想对单个项目进行操作，我们应该怎么做

如果您只是从集合中获取一个值，那么如果元素是第一个，则无需执行任何特殊操作；只需使用getter（见上文）

否则，您至少有两个选项：

使用、、等获取一个新的jQuery集，其中只包含所需的元素，或

使用

$（yourSet[n]）

仅围绕

n

th元素构建一个新集合

jQuery对象类似于数组；当您使用

[]

符号对它们进行索引时，您可以访问该索引处的原始元素。因此，

$（yourSet[n]）

获取原始元素（

yourSet[n]

），然后将其包装到jQuery对象中

谈谈你对它的看法：

• 像正则数组一样迭代整个列表

当然；use，它调用回调函数，使用

this

引用集合中的每个条目。（它也可以作为参数使用。）注意，它将是原始条目（例如，原始DOM元素），而不是jQuery对象

• javascript的过滤功能

jQuery构建了一个类似JavaScript的

Array.prototype.filter

的函数。（或者，您可以向其传递一个字符串，当用作CSS选择器时，它将根据这些字符串是否与该字符串匹配来过滤集合。）

• 还有别的事（想不出来）

jQuery的访问器函数的另一个强大方面是，它们中的大多数都接受回调，这使您可以在为每个元素提供不同值的元素之间循环（如果希望其中一些元素的值保持不变，则可以不返回任何内容）。例如，这会将文本中元素的索引附加到其文本中，但仅适用于具有奇数索引的条目：

$("some-selector").text(function(index) {
    if (index % 2 === 1) {
        return $(this).text() + " - " + index;
    }
});

---

上述各种情况的示例：

var divs=$（“div.x”）；
//getter从集合中的第一个条目获取
console.log（divs.attr（“类”）；//“x a”，第一班的学生
//…除了'text'，它是不同的：
console.log（divs.text（））；//连接在一起的所有元素的文本
//在所有元素上设置setter；这将使它们全部变为绿色：
css分类（“颜色”、“绿色”）；
//让我们仅加粗第三个元素：
等分（2）css（“字体重量”、“粗体”）；
//让我们使用[]符号将第四个斜体标记为：
$（divs[3]）.css（“字体样式”、“斜体”）；
//让我们使用'filter'只获取奇数元素
//索引，并在结果输出文本上使用'each'
筛选器（函数（索引）{返回索引%2==1；}）。每个（函数（）{
console.log（$（this.text（））；
});
//让我们使用'text'将索引添加到每个元素的末尾：
divs.text（函数（索引）{
返回$（this）.text（）+“-”+索引；
});
//（注意：上面使用“css”只是为了说明访问器是如何工作的；一般来说
//更喜欢使用类而不是直接设置样式）

首先
第二
第三
第四
第五

有段时间没听过“问约翰·雷斯格（ask John Resig）”：）我一直在想你怎么能在大约10分钟内给出这么好的、广泛的答案。@Jonasw:jQuery恰好是我很熟悉的工具，我妈妈建议我在高中上一堂触摸打字课。这很可能是她在高中时给我的最好的建议，而且这个标准已经相当高了。：-）