如何在具有Javascript的DOM上查找并单击此元素？

Question

我需要单击此元素。 id并不恒定，并且每次出现按钮时都会重新生成。 按类别搜索提供了太多选择。 找到并单击它的好方法是什么？ 元素：

<input type="button" class="simpleInputPushButton" value=OK id="ext-gen141">

只是为了澄清，我正在使用selenium来自动化站点，出于某种原因，Selenium会将该元素显示为未显示，因此我需要使用JS。 在这种情况下，可以使用jQuery机器人。

Answer 1

您可以通过其value获取该元素。 我相信该元素的value将是相同的：

 var elem = document.querySelector('input[value=OK]'); console.log(elem); //then assign click event elem.addEventListener('click', function() { console.log('clicked elem with id ' + this.id); }) 

 <input type="button" class="simpleInputPushButton" value=OK id="ext-gen141"> 

Answer 2

您可以使用document.querySelector获得元素。 随附的onclick仅用于测试

 let m = document.querySelector('input[value="OK"]').click() function test() { alert('Hello') } 

 <input type="button" class="simpleInputPushButton" onclick='test()' value='OK' id="ext-gen141"> 

Answer 3

通过ID获取此元素并触发其上的click事件

document.getElementById('ext-gen141').click();

Answer 4

您可以使用选择器的组合来唯一地唯一标识元素：

• 基于父选择器：

  div.parentClassName input[type="button"].simpleInputPushButton

• 基于部分属性值匹配：

  • 以。。开始

    input[type="button"][id^="ext-gen"].simpleInputPushButton

  • 以。。结束

    input[type="button"][id$="-141"].simpleInputPushButton

  • 包含

    input[type="button"][id~="gen"].simpleInputPushButton