javascript - 单行 Javascript 方法查找具有特定文本的项目然后调用单击

Question

我希望能够点击一个没有 ID 的输入，该输入位于一个也没有 ID 的 LABEL 中。

这是示例 HTML...

<label>
<input type="radio" />
 item1
</label>
<label>
<input type="radio" />
 item2
</label>
<label>
<input type="radio" />
 item3
</label>

现在只使用 Javascript。在此示例中，我如何才能仅调用对 item2 的点击？

我知道我可能会在所有 document.getElementsByTag("label") 中执行一个 FOR 循环，然后检查每个文本的文本，然后在我找到特定标签后可能调用一次点击...

但我想知道是否可以用一种非常简化的方法来做到这一点，而不是像使用 document.querySelectorAll("label") 或其他达到这种效果的方法？就像有没有注意到那会让我像呃...

 document.querySelectorAll("label[text='item2']").click()

没有这样的事情或任何可能的事情？

需要在已经存在的页面上执行此操作，因此创建一个 Javascript 方法来调用/引用在这种情况下不起作用

编辑 #1 - 基于人们声明单一选择器是不可能的

如果使用 querySelectorAll 无法做到这一点并且您必须使用 For-Loop/While 那么您将如何在一行中完成此操作？

我知道有时候你可以做一些像...

javascript:(function() { document.getElementById('LABELID').value+='SETVALUE'; document.querySelectorAll("Button[type='submit']")[0].click();})()

是否可以在一行中进行搜索和点击？

Answer 1

假设在示例代码中显示的标签元素之前，同一父级中的同一级别上没有其他标签元素，您可以使用

label:nth-of-type(2) input

获取第二个输入元素的选择器。

http://jsfiddle.net/vry1n7op/

:nth-of-type 伪类的工作原理在 f.e. 中有描述。在这里，https://developer.mozilla.org/en/docs/Web/CSS/:nth-of-type :

“The :nth-of-type CSS pseudo-class matches an element that has an+b-1 siblings with the same element name before it in the document tree, for a given positive or zero value for n, and has a parent element.”