使用带有 querySelectorAll 的 innerHTML

Question

我想在重新提交尝试时使用类似于以下内容的内容来清除表单中的错误：

document.querySelectorAll("#form-error-name, #form-error-email, #form-error-tel, #form-error-dob, #form-error-password, #form-error-goal").innerHTML= "";

...但 div 的内容没有被清除。我究竟做错了什么？

Answer 1

您需要循环遍历结果

    var errors = document.querySelectorAll(
               "#form-error-name, 
                #form-error-email, 
                #form-error-tel, 
                #form-error-dob, 
                #form-error-password, 
                #form-error-goal");

[].forEach.call(errors, function(error) {
  error.innerHTML = '';
});

querySelectorAllforEach不返回数组，而是返回节点列表，其原型上没有方法。

上面的循环使用了forEachnodeList 对象上数组对象原型上的方法。

Answer 2

问题需要.innerHTML，但这在 上无效input；你实际上想要.value。适当的现代答案是

[... document.querySelectorAll('input')]
  .map(i => i.value = '');

Answer 3

尝试这个：

var x = document.querySelectorAll("#form-error-name, #form-error-email, #form-error-tel");
var i;
for (i = 0; i < x.length; i++) {
    x[i].innerHTML = "";
}

看看，如果这有帮助。