如何在 css 代码中更改属性背景颜色

How to change the Attribute background color in css code

本文关键字：属性 背景 颜色 css 代码      更新时间：2023-09-26

我使用了以下代码，我想在单击下一个菜单时替换旧颜色。

请给我解决方案。单击下一个选项时如何替换旧颜色。

网页代码：

    <head>
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript">
      function ChangeColor(obj) {
         obj.style.backgroundColor = "#bfcbd6";
      }
</script>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css">
<ul id="css3menu1" class="topmenu">
    <li class="topmenu"><a onclick="ChangeColor(this);"  href="#" title="Home" style="width:154px;" >Home <span class="numberend">1</span> </a></li>
    <li class="topmenu"><a onclick="ChangeColor(this);" href="#" title="Product info" style="width:154px;"><span>Product info</span></a>
    </li>
</ul>
</div>   
</body>
</html>

请查看以下链接：http://jsfiddle.net/8JwhZ/1058/

如果我理解你的帖子，你就在 jsfidle 上得到了经验。

你可以使用这样的东西：

  </head>
  <script>
   $('.menu').click(
      function(){
         $(this).css("background","#bfcbd6")
      }
    )
  </script>
  <body>
  <link rel="stylesheet" href="css/style.css" type="text/css">
    <ul id="css3menu1" class="topmenu">
      <li class="topmenu"><a href="#" title="Home" class="menu" style="width:154px;" >Home <span class="numberend">1</span> </a></li>
      <li class="topmenu"><a href="#" class="menu" title="Product info" style="width:154px;"><span>Product info</span></a>
      </li>
    </ul>
</body>

http://jsfiddle.net/7F7BP/1/

demo 

function ChangeColor(obj) {
    /* Set all the link colors back to the original one */
    var links = document.querySelectorAll('.topmenu a');
    for (i = 0; i < links.length; i++) {
        links[i].style.backgroundColor = "#005984";
    }
    /* Set the color of the selected one */
    obj.style.backgroundColor = "#bfcbd6";
}
相关文章：