javascript不會更改span容器的顏色

Question

我正在嘗試使用document.getElementById("indicator").style.color = "red";更改span的文本顏色document.getElementById("indicator").style.color = "red";

和日志

console.log(document.getElementById("indicator").style.color);

告訴我它變了，但顏色還是“黑”

我在項目中使用不同的css和bootstrap。 我該如何解決這個問題？

Answer 1

您需要確保在加載DOM項目后調用腳本。 如果使用jQuery，您只需將函數包裝在文檔就緒標記中，如下所示：

$(function(){
document.getElementById("indicator").style.color = "red";
})

小提琴：

https://jsfiddle.net/5jqhf7hz/

如果您使用的是純JavaScript，則需要確保腳本在DOM元素之后列出。 將腳本放在頁面的末尾應該可以實現此目的。

Answer 2

我只是在我的IDE上測試了這個並獲得了紅色文本。 您可能想要檢查您的HTML標記是否具有相應的標記ID“指示符”，因為語法是正確的。 還要確保您的HTML頁面鏈接到您的Javascript頁面。

將您的JS頁面放在HTML的底部。

<script src="js/javascript.js"></script>

編輯：我剛剛意識到你正在使用bootstrap。 我使用bootstrap很多次，並且它的CSS有問題。 基本上，網頁將Bootstrap CSS作為優先級。 從我發現的內容中重寫它的唯一方法是：

1. 進入Bootstrap CSS並輸入您想要的顏色。 （不可取）。
2. 編寫更具描述性和更窄的CSS。 你的描述越多，CSS就會把你的代碼放在bootstraps CSS之上。