为什么CSS选择器返回一个元素数组?

时间:2013-07-06 01:34:38

标签: javascript css css-selectors jquery

我正在编写非常基本的html,并希望使用css选择器只选择一个元素。但是,查询返回数组中的一个元素。我可以通过使用[0]索引数组来访问我的元素但是有没有办法修改查询以仅返回我的元素?

<input class='myInput' id='myId'>

Css选择器:

'input.myInput'

在Chrome开发者控制台中使用时,我看到:

[<input class='myInput' id='myId'>]

而不是:

<input class='myInput' id='myId'>

2 个答案:

答案 0 :(得分:3)

您可以使用querySelector()方法,该方法始终返回查询中的第一个元素:

var element = document.querySelector('input.myInput');

jQuery没有直接的等价物,所以你必须使用[0]索引。

答案 1 :(得分:2)

jQuery使用jQuery Object返回查询,jQuery Object是返回对象的数组。所以要获得你正在寻找的行<input class="myInput" id="myId">你需要做的是$('input.myInput')[0];得到数组中的第0个元素,在这种情况下只有一个,但要获取HTML元素你选择器查询后需要[0]

仅仅是关于获得相同输入的方法:

$('.myInput')[0];
$('#myId')[0];
$('input')[0];

或者上面的任何.first()而不是[0]的选择器,因为它们都抓取了返回的jQuery对象中的第一个元素。