javascript - 无法更改 javascript 中的特定文本颜色

Question

这是我的代码。这是一个简单的功能，当它显示 Active eventStatus 时我需要更改文本颜色:

function() {
    var diff, status;
    diff = moment().diff(date, 'days')
    if (diff > 0) {
      status = 'Ended';
    }
    if (diff < 0) {
      status = 'Pending';
    }
    if (diff === 0) {

      status = 'Active';


        //status.style.color = "#132111"

        // document.getElementById('greenActive').style.color = "green"
    }
    return status;
  }

更新HTML:

  <td id = "status-column"  >
      <span id="greenActive" >{{eventStatus}}</span>  
   </td>

我尝试同时使用“status.style.color”和“getElementById”。结果是数据/文本根本不会显示。

我做错了什么吗？

预先感谢您的帮助!

Answer 1

编辑:

您的代码可以正常工作，但正如我所说，您需要确保在 DOM 加载后执行代码

(function() {
    var diff, status;
    diff = 0
    if (diff > 0) {
      status = 'Ended';
    }
    if (diff < 0) {
      status = 'Pending';
    }
    if (diff === 0) {

      status = 'Active';

        document.getElementById('greenActive').style.color = "green"
    }
    return status;
  })();

  <td id = "status-column"  >
      <span id="greenActive" >{{eventStatus}}</span>  
   </td>

在调用您的函数之前，您需要确保加载的文档和您尝试修改的 DOM 元素可用。可以看js修改文字颜色的demo here