Question

我目前有一个将字符串数组输出到html页面的函数。如何设置输出文本的颜色？这是写入页面的代码：

function showErrors() {
    if (errList.length >= 1)
    document.getElementById("errorsSpace").innerHTML = errList.join('<br/>');
}

我尝试使用＆＃34; color：red＆＃34;没有运气。我收到一条错误，上面写着＆＃34;无法设置属性＆inner;内部HTML＆＃39; of null＆＃34;

这是其余代码的jsfiddle：https://jsfiddle.net/wd6fpgm6/

Answer 1

尝试以下操作 - 将数组转换为包含html和在CSS中设置样式的错误类的字符串 - 然后将整个字符串插入到hhtml中并具有正确的结构和样式：

//CSS
.error{color:red}

//js
function showErrors() {
    var errors ="";
    if (errList.length >= 1)
      {
        for(i=0;i<errList.length;i++){
         errors+="<p class='error'>" + errList[i] + "</p>;";
          }
        document.getElementById("errorsSpace").innerHTML = errors;
      }
}

//result will be 

<div id='errorsSpace'>
    <p class='error'>Error 1</p>;
    <p class='error'>Error 2</p>;
    <p class='error'>Error 3</p>;
</div>

你甚至可以在p上省略class =“error”并让css为：

#errorsSpace p{color:red}

Answer 2

您可以将每个错误放在段落标记中，只需设置标记的颜色，而不是在每个错误后放置一个标记。

Answer 3

你尝试过这些方法吗？

document.getElementById("errorsSpace").setAttribute("style", "color:red");

或

document.getElementById("errorsSpace").style.color = "red";

CSS - 如何设置使用＆＃34; innerHTML＆＃34;写的字符串的颜色。成为一个div

3 个答案: