通过脚本

Question

我有一个HTML代码，我想用动态变量定义样式。基本上我想根据用户来自的URL更改按钮的颜色。

更改ID =＆＃34; wtv＆＃34;的颜色使用jscript

这样的事情：

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

link1是＆lt;的ID。 a＆gt;标签

样式项如下：

.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代码：

＆＃13;

＆＃13;

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

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;