jQuery（）对象可以容纳非DOM对象吗？ [英] jQuery() objects can hold not-DOM objects?
问题描述
分析代码这个问题，我刚刚注意到它使用jQuery迭代JSON数组的方式：
Analyzing the code showed by this SO question, I just noticed the way it's using jQuery to iterate a JSON array:
$(data).each(function() {
虽然我认为数组应该以这种方式迭代：
while in my mind an array should rather be iterated this way:
$.each(data, function() {
确实， jQuery.each（）手册页面状态：
$ .each（）函数与$（selector）.each（）不同，用于在jQuery对象上独占迭代。
The $.each() function is not the same as $(selector).each(), which is used to iterate, exclusively, over a jQuery object.
但是因为OP似乎让他的代码至少部分工作了很好奇测试，发现它有效！
这是证明：
But since the OP seemed to have his code at least partially working I was curious to test, and discovered that it works!
Here is the proof:
var data = [
{"key": "value-1"},
{"key": "value-2"},
{"key": "value-3"}
];
$(data).each(function() {
document.write('<br />' + this.key);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
因此，如果 $（data）.each（）在 data 是一个JSON数组时有效，这似乎意味着这个数组是 $（data）的可接受内容，用于返回一个jQuery对象。
So if $(data).each() works when data is a JSON array, it seems to mean that this array is an acceptable content for $(data) to return a jQuery object.
然后进行调查我检查了 jQuery（elementArray）手册页并查看了 jQuery（elementArray）部分，哪个状态s：
Then pursuing the investigation I checked the jQuery(elementArray) manual page and looked at the jQuery( elementArray ) section, which states:
elementArray
类型：Array
包含集合的数组 DOM元素包装在jQuery对象中。
elementArray
Type: Array
An array containing a set of DOM elements to wrap in a jQuery object.
根据上面的说明，一个对象数组（而不是DOM）应该失败。
所以我测试比较这个 $（数据）和一个简单的 $返回的对象（ '主体'）。结果如下：
According with the above, an array of objects (instead of DOM elements) should fail.
So I tested to compare the objects returned by either this $(data) and a simple $('body'). Here is the result:
var data = [
{"key": "value-1"},
{"key": "value-2"},
{"key": "value-3"}
];
function log(obj, init) {
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
var $row = $('tr[data-prop=' + prop + ']');
if (!$row.length) {
$row =
$('<tr data-prop="' + prop + '"><th>' + prop + '</th></tr>')
.appendTo($('table'));
if (!init) {
$row.append('<td></td>');
}
}
$row.append('<td>' + JSON.stringify(obj[prop]).substr(0,25) + '</td>');
}
}
}
log($('body'), true);
log($(data), false);
table {
border-collapse: collapse;
border: 1px solid #000;
}
th, td {
border: 1px solid #000;
padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<th>Property</th>
<th>$('body')</th>
<th>$(data)</th>
</tr>
</table>
实际上它出现了所有东西都可以转换为jQuery对象。
我很困惑：我是不是重新发明轮子了？？
Actually it appears that everything can be converted to a jQuery object.
I'm puzzled: am I reinventing the wheel!?
推荐答案
是的，jQuery构造函数接受一个数组，您可以使用 $。fn.each 方法和这个迭代返回的jQuery集合处理程序中的code>指的是每个元素。 jQuery集合是 array-like 对象。
Yes, jQuery constructor accepts an array and you can iterate through the returned jQuery collection using $.fn.each method and this within the handler refers to each element. A jQuery collection is an array-like object.
但是，不，这并不意味着您可以成功调用集合上所有与DOM相关的方法。只需尝试 $（data）.html（）作为示例，您将看到错误，因为它希望看到 DOM节点而不是普通对象或集合中的字符串。
But, no, this doesn't mean that you can call all DOM related methods on the collection successfully. Just try $(data).html() as an example and you will get an error as it expects to see a DOM node and not a plain object or a string in the collection.
另一个例子是尝试 $（['foo']）。 text（）并抛出未捕获的RangeError：jQuery 2.2.2中的最大调用堆栈大小超出错误。
As another example try $(['foo']).text()and it throws Uncaught RangeError: Maximum call stack size exceeded error in jQuery 2.2.2.
现在尝试：
/**
* `text` reads textContent of DOM elements (nodeType = 1)
* and `nodeValue` of textNodes (nodeType = 3)
* and returns the concatenated text
*/
$([
{ "nodeType": 1, "textContent": "value-1" },
{ "nodeType": 3, "nodeValue": "value-2" },
{ "textContent": "I'm a rebel" }
]).text()
并返回value-1value-2！
这篇关于jQuery（）对象可以容纳非DOM对象吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
