如何解决无法移除网页所有元素的text-danger、invalid类的问题

核心问题是DOM选择器写法错误，导致没有匹配到任何需要移除类的元素，移除逻辑完全没有执行：
你写的document.querySelectorAll("text-danger invalid")会被识别为「查找标签名为text-danger的元素的后代中，标签名为invalid的元素」，完全匹配不到带对应类的DOM节点，自然无法完成类移除操作。

showErrorMessage(message, className) {
      // 匹配所有携带text-danger类或invalid类的元素
      let elems = document.querySelectorAll(".text-danger, .invalid");
      elems.forEach(function(el) {
        // 分别传入要移除的类名，兼容单个类存在的场景
        el.classList.remove("text-danger", "invalid");
      });

      // 用classList.add添加类，自动处理空格避免拼接错误
      document.querySelector(className).classList.add("text-danger", "invalid");
      Swal.fire(
        'Błąd',
        message,
        'error'
      );
    }

如果需要兼容IE等旧浏览器，可以把elems.forEach换回原来的[].forEach.call(elems, function(el) { ... })写法即可。

• 选择器替换为.text-danger, .invalid：.前缀代表类选择器，逗号代表多选逻辑，能匹配所有需要清理类的节点
• classList.remove拆分传入两个类名，不管元素是否同时拥有两个类，都会正确移除存在的对应类
• 新增类改用classList.add方法，不需要手动处理空格，避免出现类名拼接错误的问题

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