Question

我用javascript制作自动浏览器脚本，我想在这个网站上使用click（）命令，但网站上的按钮没有Id（工作正常）。但是它只有一个类名。当我做document.getElementsByClassName(btn.btn-danger.btn-lg.btn-block.betButton).click()它不起作用。

以下是我要点击的按钮的检查：

<button class="btn btn-danger btn-lg  btn-block betButton" data-color="r">1 to 7, Win x2</button>

是否可以使用按钮上的click（）函数？有没有办法自己分配一个ID？谢谢你的回答：）

我不认为这是副本，因为我知道有什么不同之处。但按钮没有任何Id只有一个类名。因为这不起作用我还能做什么来触发click（）事件？

Edit2 =有3个按钮，所有相同的类名称，唯一的区别是按钮的文本和数据颜色，有没有办法操纵它？

Answer 1

getElementsByClassName返回HTMLCollection，这是一个类似数组的对象。

这意味着在你的情况下，你应该得到索引为0的元素，理想情况下，你正在构建的应用程序类型应该是你得到的唯一一个：

document.getElementsByClassName('btn btn-danger btn-lg btn-block betButton')[0].click()

否则，如果网站更新并且与您的选择器匹配的元素更改了订单，您的扩展程序可能会停止工作。

另请注意，正如@Barmar指出的那样，要使用getElementsByClassName来过滤多个类，您应该使用空格，而不是点。

假设你有：

<button class="a"></button>
<button class="a b"></button>
<button class="a.b"></button>

然后：

document.getElementsByClassName('a')将返回HTMLCollection，其中包含课程a的所有元素：[<button class="a"></button>, <button class="a b"></button>]
document.getElementsByClassName('a b')将返回HTMLCollection，其中所有元素都包含类a和b：[<button class="a b"></button>]
document.getElementsByClassName('a.b')将返回HTMLCollection，其中包含课程a.b的所有元素：[<button class="a.b"></button>]

您可以使用querySelectorAll来使用.a.b或querySelector之类的选择器，而不是HTMLCollection只会返回与选择器匹配的第一个元素，所以你可以马上打电话给click：

document.querySelector('.btn.btn-danger.btn-lg.btn-block.betButton').click()

Answer 2

删除.的
该函数返回一个类似于数组的对象，提示名称为复数，因此您必须在数组中指定一个键。

<强> HTML

<button class="btn btn-danger btn-lg  btn-block betButton" data-color="r">1 to 7, Win x2</button>

<强>的JavaScript

document.getElementsByClassName('btn btn-danger btn-lg  btn-block betButton')[0].style.backgroundColor = 'red';

示例

JSFiddle

注意...

从这个example中可以看出，需要删除.才能正常工作，因为JavaScript已经知道你正在通过你正在使用的函数选择类

使用querySelector

<强>的JavaScript

document.querySelector('.btn-danger.btn-lg.btn-block.betButton').style.backgroundColor = 'red';

示例

JSFiddle

click（）命令无法处理document.getElementsByClassName（）

2 个答案:

注意...