javascript - 为什么将 jQuery 的 .append() 函数与带有元素名称和其中的数组作为单个参数的 jQuery 对象一起使用？

Question

我有一个关于 jQuery 的 .append 函数如何在以下代码段中工作的问题，该代码段动态地将值添加到选择框:

for (var i=currentYear; i >= minYear; i--){
    $('#year').append($("<option/>", { value: i, text: i}));
}

我已经知道这段代码确实有效，因为我在谷歌搜索期间在线找到类似的代码后就以这种方式使用过 .append 。然而，我在( https://stackoverflow.com/a/3155663/3120918 )上找到类似代码的网页并没有解释它的工作原理。我准备好了有关 .append 函数 ( http://api.jquery.com/append/ ) 的官方 jQuery 文档页面，但它没有说明如何传入包含自闭合选项元素和数组 ( $("<option/>", {value: key, text: value }) ) 的单个 jQuery 对象作为单个对象附加函数的参数。我希望有人可以向我解释这是如何以及为什么有效的。

Answer 1

jQuery object containing both a self-closed option element and an array ( $("<option/>", {value: key, text: value }) )

不，这是 jQuery constructor for "creating elements" 的特殊形式:

If a string is passed as the parameter to $(), jQuery examines the string to see if it looks like HTML [and if it does], jQuery attempts to create new DOM elements as described by the HTML.

[…]

The second argument to jQuery() can accept a plain object consisting of a superset of the properties that can be passed to the .attr() method.

Important: If the second argument is passed, the HTML string in the first argument must represent a a simple element with no attributes. As of jQuery 1.4, any event type can be passed in, and the following jQuery methods can be called: val, css, html, text, data, width, height, or offset.

[…]

所以这里发生的是构建一个新的 <option>具有给定值和文本的元素，它包装在 jQuery 集合中。然后将其传递给 append ，它(像往常一样)将集合中的所有元素附加到其元素中 - 在这里，新选项是 #year <select>元素。