如何删除最初显示的innerHTML值

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何删除最初显示的innerHTML值相关的知识,希望对你有一定的参考价值。

我试图在javascript中创建一个乘法表。提示用户提供表号(1到10),之后所有问号('?')都用该号码替换。然后,用户需要在所有提供的文本字段中输入答案。最后,用户可以选择检查答案(即是对还是错)。

当我运行我的代码。输入用户数据后提示它显示每个Incorrect前面的textfield并且用户在Check answers按钮之前输入值。如何删除它们以便最初显示。

输出:我的代码:

function result() 
    var value = document.getElementById("a1").value;
    var checkMessageSpan1 = document.getElementById("checkMessage1");
    var checkMessageSpan2 = document.getElementById("checkMessage2");
    var r = x * 1;
    if (value == x) 
    checkMessageSpan1.innerhtml = "<span style=\"color:green\">"+"Correct!";
    else
    checkMessageSpan1.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    



    var value = document.getElementById("a2").value;
    var r = x * 2;
    if (value == r) 
    checkMessageSpan2.innerHTML = "<span style=\"color:green\">"+"Correct!";
    else
    checkMessageSpan2.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    


</script>
<button onClick="alert_field()"> Generate Question</button><br><br>

<p id="s1">
? x 1 = <input type="text"  id="a1"><span id="checkMessage1"></span><br>
? x 2 = <input type="text"  id="a2"><span id="checkMessage2"></span><br>

</p><br><br>
<p id="a"></p>

检查答案

答案

尝试添加此代码:

var value = document.getElementById("a1").value;
if (checkMessageSpan1.style.display === "none") 
    checkMessageSpan1.style.display = "inline-block";
 else 
    checkMessageSpan1.style.display = "none";


var value = document.getElementById("a2").value;
if (checkMessageSpan2.style.display === "none") 
    checkMessageSpan2.style.display = "inline-block";
 else 
    checkMessageSpan2.style.display = "none";

另一答案

要替换所有特殊字符,您可以使用js var res=str.replace(/[^a-zA-Z0-9]/g,x);中的正则表达式而不是var res = str.replace("?",x);

有关JS https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions中正则表达式的更多信息

以上是关于如何删除最初显示的innerHTML值的主要内容,如果未能解决你的问题,请参考以下文章

带有innerhtml的Vuejs

DOM 元素的 InnerHTML 属性已更改,但未呈现

PHP nodeValue剥离html标签-innerHTML替代品?

如何从innerHTML输出中删除引号

ecshop如何去除后台左侧云服务中心菜单

真的有必要使用数组,在子删除后显示完整节点列表的innerHTML吗?