$（selector）[0]在jQuery中的含义是什么？

，我不明白的语法是这样的：

$("#profilePhotoFileUpload")[0]

我一直很频繁看到这个语法，我已经忽略了一段时间，因为我从来没有使用它。但现在，为了理解这篇文章How do I upload an image using the Parse.com javascriptSDK?的代码，我不能再忽略它了。我知道[0]这个语法通常用于指代一个数组。但似乎有点奇怪，对id的引用会生成某种数组。

来源

2015-09-25 Jae Kim

它访问直接在DOM元件，而不jQuery的包装。 – Blender

接下来，这个函数能够处理类和ID，因此可以产生一个元素数组或一个元素。因为每个约定都有一个具有多个返回类型的函数，所以它总是会返回一个数组，因为数组只能包含一个匹配。 –

[密切相关的（http://stackoverflow.com/questions/1302428/what-does-jquery-actually-return） – Jashwant

通过追加[0]到jQuery对象将返回第一个 DOM元素。

正如你在这里使用的ID选择器，将只有一个元素在数组中，所以使用[0]是有道理的。如果你选择多个元素，你也可以使用任何介于0和元素个数之间的数字，你可以得到相应的DOM元素。

从jQuery Docs

jQuery对象包含文档对象模型（DOM）已经从HTML字符串创建或从一个文件选择的要素的集合。由于jQuery方法通常使用CSS选择器来匹配文档中的元素，因此jQuery对象中的元素集通常称为一组“匹配元素”或“选定元素”。

jQuery对象本身的行为很像一个数组;它具有length属性，对象中的元素可通过其数字索引[0]至[length-1]进行访问。请注意，一个jQuery对象实际上并不是一个Javascript数组对象，因此它没有真正的Array对象的所有方法，如join()。

来源

2015-09-25 13:58:27 Tushar

我看到...所以'[0]'不代表数组或类似的东西。 –

应该说会返回集合中的***第一个***元素 – charlietfl

@JaeKim：正确。括号符号可以用于任何对象。所有做的就是访问该对象的属性'0'。示例：'（{0：42} [0]）'返回42. –

根据jQuery文档，$（）返回一个匹配元素的集合，这些匹配元素可以基于传递的参数在DOM中找到，也可以通过传递HTML字符串创建。通过添加[0]，您可以将元素的集合包装关闭，并在处理id时返回实际的DOM元素。当处理一个类时，你会通过括号表示法（在这里是第一个，因为基于JavaScript的数组是0）返回数组中的元素。

来源

2015-09-25 14:03:33 rphuber

在id选择器的情况下，追加[0]没有意义，因为$("#theIdOfTheElement")将始终返回第一个元素。

来源

2015-09-25 14:45:48

错误。只是因为标准说你不能拥有多个具有相同ID的元素并不意味着浏览器会对此感到恐慌。事实上，大多数浏览器我知道会允许这样的行动和ID选择可以返回多个元素 – Steve

jQuery使用的document.getElementById（ID）（见：https://api.jquery.com/id-selector/），一个参考返回元素（如果你有相同ID的多个元素的第一个）（见：https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById）还看到：HTTP： //stackoverflow.com/questions/14408891/getelementbyid-multiple-ids –

好了，不跟DOM node/element混淆jQuery Object。

this应尽可能简单

$(this)[0] === this

和

$("#target")[0] === document.getElementById("target");

例如

// Setting the inner HTML with jQuery.  
var target = document.getElementById("target");  

// Comparing DOM elements. 
alert($(target)[0] === target); // alerts "true" 

// Comparing DOM element and jQuery element 
alert($(target)[0] === $(target).eq(0)); // alerts "false"

我们必须牢记，无论$(target)[0]和$(target).get(0) 回报具有DOM属性，如.innerHTML 和像.appendChild()方法，但不是jQuery的方法，如 .html()或.after()相同的DOM元素，而$(target).eq(0)返回的jQuery 对象，其具有像.html()和.after()有用的方法。

更重要的是

var logo1 = $("#logo"); 
var logo1Elem = logo1.get(0); 

var logo2 = $("#logo"); 
var logo2Elem = $("#logo")[0];

虽然logo1和logo2以同样的方式被创建（和包装相同的DOM元素），它们不是同一个对象。

// Comparing jQuery objects. 
alert($("#logo") === $("#logo")); // alerts "false" 

// Comparing DOM elements.  
alert(logo1Elem === logo2Elem); // alerts "true"

价：https://learn.jquery.com/using-jquery-core/jquery-object/

来源

2017-03-31 06:02:36 kolunar

$（selector）[0]在jQuery中的含义是什么？

回答

相关问题