如何实现JavaScript用户脚本仅在无密码输入字段的页面运行？

核心思路 #

要实现「无密码输入字段时才执行脚本」的逻辑，关键是准确检测页面中是否存在密码输入框，再根据检测结果控制脚本执行。

正确的检测与判断逻辑 #

方法1：用document.querySelector快速检测

querySelector会返回匹配的第一个元素，找不到则返回null，是最高效的检测方式：

// 检测是否存在密码输入框
const hasPasswordInput = document.querySelector('input[type="password"]') !== null;

// 逻辑：无密码框时执行脚本内容
if (!hasPasswordInput) {
  // 这里放入你原本的脚本代码
  console.log("执行脚本操作");
}

方法2：提前终止脚本（更简洁）

如果页面存在密码框，直接终止脚本执行，省去后续代码的包裹：

// 检测到密码框就直接退出
if (document.querySelector('input[type="password"]')) {
  return;
}

// 以下是你原本的脚本代码
console.log("执行脚本操作");

为什么你之前用querySelectorAll失败？ #

你可能犯了一个常见错误：直接判断querySelectorAll返回的NodeList对象，而非它的长度。因为即使没有匹配元素，NodeList也是一个空对象，直接判断会得到true，导致逻辑错误。正确的写法应该是：

// 正确的querySelectorAll判断方式
const passwordInputs = document.querySelectorAll('input[type="password"]');
if (passwordInputs.length === 0) {
  // 无密码框，执行脚本
}

确保DOM加载完成再检测 #

如果脚本运行时机过早（DOM还没渲染完），会出现找不到元素的情况。在用户脚本中，可以通过配置@run-at确保脚本在DOM就绪后执行：

// ==UserScript==
// @name         你的脚本名称
// @match        你的目标网站URL
// @run-at       document-end  // 关键：DOM加载完成后执行
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 先检测密码框
    if (document.querySelector('input[type="password"]')) {
        return;
    }

    // 这里放你原本的脚本代码
    console.log("执行脚本操作");
})();

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