如何使用JavaScript覆蓋CSS？

Question

我發現這樣的客戶代碼css

 header.type-2:not(.fixed-header) nav>ul>li>a{ color:#000; } 

我正在嘗試使用javascript將顏色覆蓋為#fff，但仍然沒有運氣。

使用以下代碼：

 <script> var elems = document.getElementsByClassName('header.type-2:not(.fixed-header) nav>ul>li>a'); for(var i = 0; i < elems.length; i++) { elems[i].style.color = '#fff'; } </script> 

我無法以CSS樣式直接進行編輯，因為我沒有權限，但是有興趣的是，我可以執行簡單的JavaScript語法，例如alert（）;。

請幫我。

Answer 1

document.getElementsByClassName按其class選擇元素，不適用於示例中的復雜選擇器。

您可以改用document.querySelectorAll 。

var elems = document.querySelectorAll('header.type-2:not(.fixed-header) nav>ul>li>a');

Answer 2

您不是按類查詢，而是按選擇器查詢，請使用querySelectorAll

 var elems = document.querySelectorAll('header.type-2:not(.fixed-header) nav>ul>li>a'); //console.log(elems) for(var i = 0; i < elems.length; i++) { elems[i].style.color = '#f00'; } 

 header.type-2:not(.fixed-header) nav>ul>li>a{ color:#000; } 

 <header class="type-2"> <nav><ul><li><a href="#">BOB</a></li></ul></nav> </header> 

Answer 3

這個beautyfull oneliner可能會成功。 您只需要為其指定功能。 您認為應該欺騙該事件以將其更改為CSS嗎？

它的作用是將width從其先前的值更改為下面寫入的值。 它也可以是一個變量。 ClassToLookFor是將更改其值的class 。

在下面的情況下， 如果頁面上存在指定的class （在這里是tricker ），我將更改class的width （我將其用於響應更快的網頁）。

$(function(){
if (!$(".tricker").length) $(".ClassToLookFor").css('width', '100%');
});