Javascript - 从页面中获取元素点击它。 getElementsByClassName 不起作用答案

【问题标题】：Javascript - get element from page click it. getElementsByClassName not workingJavascript - 从页面中获取元素点击它。 getElementsByClassName 不起作用
【发布时间】：2021-04-04 03:27:33
【问题描述】：

所以我试图通过类名从页面中获取一个按钮元素。但是这个函数以及查询选择器返回未定义的值。可能是什么原因？会不会是因为这个元素是另一个元素的子元素？

var checkout_btn = document.getElementsByClassName('button-submit');
console.log("INITIALIZED"); 
console.log(checkout_btn);

Console

Button html

【问题讨论】：

使用查询来选择，var btn = document.querySelector(".button-submit");
你贴的代码没问题，不是问题。我们无能为力，因为我们没有足够的信息。如果我不得不猜测，请确保在加载 DOM 后执行它。您也可以将其放在页面末尾，就在</body> 标记之前。
@TudorAlexandru 试过了。结果相同。
@kosmos 我只是把它放在 window.onload 函数中。同样的事情也会发生。我也是通过 chrome 扩展的内容脚本来做的，也许是这个原因？另一个奇怪的事情是，如果我通过按钮标签找到元素，它会找到我需要的元素，但是当我使用下标访问它时，它会显示为 null。

标签： javascript html web-scraping browser-automation

【解决方案1】：

创建并使用 ID 代替 className 或试试这个 document.getElementsByClassName("button-submit")[0]

附言因为 getElementsByClassName 返回具有所有给定类名的所有子元素的类数组对象。

【讨论】：

我无法创建 ID，它是用于在别人的网站上执行内容脚本的 chrome 扩展。
所以尝试第二个，使用 className[0]