使用JavaScript根据输入值更改innerText的颜色

Question

下面是一个示例代码，用于通过输入文本中的值更改InnerText上的颜色。

输出看起来像这样。 颜色不变

 function validate() { var msg; var result; if (document.myForm.userPass.value.length > 5) { msg = "good"; result = msg.fontcolor("green"); } else { msg = "poor"; result = msg.fontcolor("red"); } document.getElementById('mylocation').innerText = result; } 

 <form name="myForm"> <input type="password" value="" name="userPass" onkeyup="validate()"> Strength: <span id="mylocation">no strength</span> </form> 

这里给出的答案不是我所需要的。

Answer 1

由于HTML5不使用字体标签，因此旧的fontcolor方法将无法在浏览器中使用。

所以我尝试了下面的代码。

 function validate() { var msg; if (document.myForm.userPass.value.length > 5) { document.getElementById('mylocation').style.color = "green"; msg = "good"; } else { document.getElementById('mylocation').style.color = "red"; msg = "poor"; } document.getElementById('mylocation').innerText = msg; } 

 <form name="myForm"> <input type="password" value="" name="userPass" onkeyup="validate()"> Strength: <span id="mylocation">no strength</span> </form> <hr/>