更改 Javascript 代碼中的內部文本顏色

Question

我是 JavaScript 的新手，我只是復制了下載按鈕計數器的代碼。 現在我想更改計數器的文本顏色。 有人可以幫助我嗎？

代碼

 var downloadButton = document.getElementById("download"); var counter = 30; var newElement = document.createElement("p"); newElement.innerHTML = "Job Advertisement will be visible after 30 Seconds "; var id; downloadButton.parentNode.replaceChild(newElement, downloadButton); id = setInterval(function() { counter--; if (counter < 0) { newElement.parentNode.replaceChild(downloadButton, newElement); clearInterval(id); } else { newElement.innerHTML = "You can download the file in " + counter.toString() + " seconds."; } }, 1000);

 <div> <button id="download">Download</button> </div>

Answer 1

您可以使用 CSS color屬性。

newElement.innerHTML = "<span style='color:green;'>You can download the file in " + counter.toString() + " seconds.</span>";

您也可以使用類。

newElement.innerHTML = "<span class='text-primary'>You can download the file in " + counter.toString() + " seconds.</span>";

Answer 2

嘗試這個：

newElement.style.color = "紅色"

或者你想要的任何顏色。

Answer 3

檢查以下代碼以滿足您的要求。

 var downloadButton = document.getElementById("download"); var counter = 30; var newElement = document.createElement("p"); newElement.innerHTML = "Job Advertisement will be visible after <span style='color: red;'>30</span> Seconds"; var id; downloadButton.parentNode.replaceChild(newElement, downloadButton); id = setInterval(function() { counter--; if (counter < 0) { newElement.parentNode.replaceChild(downloadButton, newElement); clearInterval(id); } else { newElement.innerHTML = "You can download the file in <span style='color: red;'>" + counter.toString() + "</span> seconds."; } }, 1000);

 <div> <button id="download">Download</button> </div>