Chrome扩展：无法获取name为login的元素且无报错问题求助

看起来你遇到的核心问题是上下文混淆，导致无法正确访问页面DOM元素，具体原因和修复方法如下：

为什么你的代码失效？ #

1. 错误的API使用场景：你在smart.js（配置为content script）里调用了chrome.webNavigation.onCompleted，但这个API是仅能在background脚本等特权上下文使用的，content script没有权限访问它。
2. DOM访问上下文错误：就算你把这段代码放到background脚本里，直接用document也无法获取页面元素——background脚本运行在独立的后台页面，和当前浏览的页面DOM完全隔离，不能直接访问。

修复方案（二选一） #

方案1：直接利用Content Script的自动注入特性 #

Content Script默认会在页面加载完成后（run_at: document_idle）注入到页面中，所以不需要额外监听导航事件，直接写逻辑即可：

修改smart.js为：

console.log("And finally " + document.getElementsByName("login").length);

这样页面加载完成后，Content Script会自动执行这段代码，直接访问当前页面的DOM，就能正确输出name="login"的元素数量。

方案2：在Background脚本中通过注入脚本获取DOM信息 #

如果你确实需要用webNavigation监听页面加载完成事件，那要把逻辑放到background脚本（你的my.js）里，通过chrome.tabs.executeScript向目标页面注入代码来获取DOM数据：

修改my.js为：

chrome.webNavigation.onCompleted.addListener(function(details) {
  // 向完成加载的页面注入代码，获取元素数量
  chrome.tabs.executeScript(details.tabId, {
    code: 'document.getElementsByName("login").length'
  }, function(results) {
    // 打印返回的结果
    console.log("And finally " + results[0]);
  });
});

同时确保你的manifest权限已经包含tabs（你已经加了），这个方法通过后台脚本触发，注入代码到页面上下文执行，再把结果返回给后台。

额外提示 #

• 检查Chrome控制台的位置：如果用方案2，日志会输出在扩展的background页面控制台里，而不是当前页面的控制台，别找错地方！
• Content Script的权限是受限的，只能访问页面DOM和部分Chrome API，而background脚本拥有更多特权，但不能直接碰页面DOM，两者的交互必须通过消息传递或者executeScript来完成。

内容的提问来源于stack exchange，提问作者Jerey