スクリプトでスタイルを定義する

Question

動的変数を使用してスタイルを定義するHTMLコードがあります。基本的には、ユーザーが来たURLに基​​づいてボタンの色を変更したいと考えています。

<script> 
document.getElementById("link1").style.color = "blue"; 
</script> 

リンク1が<のIDである>タグ

スタイルアイテムとして次のとおりです。このようなJScriptの

何かを使用してID = "WTV" の色が

変更次のようになります。

.megamenu-nav li a link1{ 
    color:#EAAB00 
} 

スクリプト内で色を定義したい動的変数を使用します。

Answer 1

少し離れているかもしれませんが、jsを使って直接スタイルを変更できます。 以下の例ではボタンを使用していますが、ページが読み込まれたときに簡単に実装できます。

<script> 

document.getElementById('button').addEventListener('click', function() { 
    var url = document.referrer; // Grabs the previous URL 
    var hex = getHexCode(url); // Function where you decide what hex value you want to use. 
    document.getElementById('p2').style["background-color"] = hex; // change style of the element. 
}) 

function getHexCode(url) { 
var hex; 
if (url.length > 30) { 
    hex = '#3333ff'; 
} else { 
    hex = '#ff0000'; 
} 
return hex; 
} 

</script> 

ここではそれがJSFiddleに実装され、 https://jsfiddle.net/7x7u79tr/1/

Answer 2

ここではbutton色を変更するには、jQueryのコードです：

$(document).ready(function() { 
 
    var buttonColor = '#EAAB00'; 
 
    $("#link1").css({ 
 
    'color': buttonColor 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id='link1'>Some link</button>