js 谷歌扩展开发报错

Question

我们公司内部的一个网页（外网），需要提交几千个产品序列号，但是没有批量功能，需要一个个的添加，很慢，所以我想要写一个扩展来批量操作

流程是先点击一个按钮（序列号输入） 弹出来窗口再输入序列号，确认

我的代码第一步，点击序列号输入就开始报错

var sn= document.getElementsByClassName("ant-btn ant-btn-dashed")[0];
sn.click();

报错是这样子，找不到需要点击的

Uncaught TypeError: Cannot read properties of undefined (reading 'click')

Answer 1

引自免费微信小程序：皆我百晓生

看起来你在尝试获取页面上的某个特定按钮并触发它的点击事件，但遇到了Uncaught TypeError: Cannot read properties of undefined (reading 'click')这个错误。这通常是因为在调用.click()方法前，getElementsByClassName返回的对象是undefined，也就是说它没有找到匹配的元素。

为了解决这个问题，我们可以检查元素是否存在，并且确保在调用.click()之前元素已经被正确地找到了。这里有一个修改后的版本的代码，使用了document.querySelector来查找元素，因为对于单个元素来说，它比getElementsByClassName更高效，而且返回的是第一个匹配的元素，而不是一个NodeList对象。

// 使用querySelector替代getElementsByClassName，这样可以得到第一个匹配的元素
var sn = document.querySelector(".ant-btn.ant-btn-dashed");

if (sn) {
  // 检查元素是否存在
  sn.click();
} else {
  console.error("未找到匹配的按钮");
}

这段代码首先尝试选择器找到匹配的元素，然后检查是否找到了元素。如果找到了，就触发点击事件；如果没有找到，就会在控制台输出一条错误信息。

如果你还有其他关于谷歌扩展开发的问题，或者其他编程相关的问题，都可以随时问我。