Question

<form id="foo">
    <input></input>
    <input></input>
    <input></input>
</form>

我想这样做：

document.getElementById("foo").getElementsByTag("input")[1];

但是在jQuery中。我想通过索引选择#foo下的某个对象。

这是我对如何做到的第一个猜测：

$('#foo input[1]').val("BlahBlah");

我认为在CSS中它也是一样的。

Answer 1

你可以这样做：

$('#foo input').eq(1).val("BlahBlah");

那会给你第二个输入。如果您想要第一个，请将1更改为0. .eq()函数为0。

Answer 2

在jQuery中，定义了一些方法来选择和使用（DOM对象）列表中的元素。

使用：

var list = $("#foo");

您将捕获整个#foo。如果你的简单，你可以使用var children = list.children();得到孩子（即输入字段）但是如果你想要一些看起来更像findElementsByTag的东西，你可以使用var children = list.find('input');（哪个可以是一个一个班轮，但通常你也想重新使用整个清单）

要获取特定子项列表的第一项和最后一项，有一些预定义的函数：

var first = children.first();
var last  = children.last();

要查找-nth元素，您可以使用http://api.jquery.com/eq/或http://api.jquery.com/nth-child-selector/

所以你会得到（注意它就像一个基于0的索引的数组）

var second = children.eq(1);

如果您更喜欢CSS选择器样式，您也可以尝试（注意基于1的索引）

var second_b = $("#foo input:nth-child(2)");

Answer 3

$('#foo :input').eq(1).val('BlahBlah')

Answer 4

您可以使用eq()选择器：

$('#foo input:eq(1)').val("BlahBlah");

Answer 5

您可以使用eq选择器。它接收从零开始的索引：

$('#foo input:eq(1)').val('a value');

Answer 6

像这样使用nth-child（n）伪类......

$("#foo input:nth-child(0)").val("BlahBlah");
$("#foo input:nth-child(1)").val("BlahBlah");
.
.
.
$("#foo input:nth-child(n)").val("BlahBlah");

Answer 7

我会说：

$($('#foo input')[1]).val("BlahBlah");

使用jQuery从Index by List中选择Element

7 个答案: