Question

使用JS＆amp; HTML标记 始终有效： Codepen

if (document.forms['myForm'].name.value == '') {
    name.style.background = "pink";
}
else {
    name.style.background = "white";
}

使用JS＆amp; CSS 并不总是有效： Codepen

if (document.forms['myForm'].name.value == '') {
    // give this element the .error class from the css file
    name.className = name.className + " error";
}
else {
    // this removes the error class
    name.className = name.className.replace(" error", ""); 
}

为什么JS＆amp; CSS不一致？我想使用这种方法，因为我可以将错误类应用于我想要影响的每个元素。

Answer 1

每当您点击提交按钮并且未填写字段时，error会被添加到classList属性中;如果您提交多次，则会添加多个课程。在删除课程时，.replace(' error', '')只会替换它遇到的第一个error实例。

您可以使用正则表达式查找error的所有实例：

name.className = name.className.replace(/ error/g, "");

Codepen

旁注：您可以利用classList，但其浏览器支持有限。

使用JS＆amp; amp;改变风格HTML工作，JS＆amp; CSS并不总是如此

1 个答案: