Change1.html function test4(event) { //获取样式表中所有class选择器都获得 var ocssRules = document.styleSheets[0].rules;//从ocssRules中取出你希望的class var style1 = ocssRules[0];if(event.value == "...
js点击改变当前菜单css样式
(function($){ $(function(){ $("#menu a").each(function(){ $(this).click(function(){ $("#menu li:eq(1) a").removeClass("cur"); }); }); $("#menu li:eq(1) a").click(function(){$(this).addClass("cur")}) });})(jQuery);2015-06-13
js可实现用户对页面中的选择条件改变页面中的样式，页面样式可以通过style修饰，也可以通过css修饰，改变css样式，代码如下：
[html] view plaincopy
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Change1.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/Change.css">
<script language="javascript">
function test4(event) {
//获取样式表中所有class选择器都获得
var ocssRules = document.styleSheets[0].rules;
//从ocssRules中取出你希望的class
var style1 = ocssRules[0];
if(event.value == "黑色") {
//window.alert(style1.style.backgroundColor);
style1.style.backgroundColor="black";
}else if(event.value == "红色") {
style1.style.backgroundColor="red";
}
}
</script>
</head>
<body>
<div id="div1" class="style1">div1</div>
<input type="button" value="黑色" onclick="test4(this)"/>
<input type="button" value="红色" onclick="test4(this)"/>
</body>
</html>2015-11-10
其实我理解你大概的要求，我写了一个简单的效果如下，另外，看了这个问题的评论，点击链接后是会发生跳转的，这个效果还有必要么？
HTML：
<html><head><script type="text/javascript" src="../jquery-1.9.1.min.js"></script><title>无标题文档</title><style type="text/css"> a{ color:#000;} .box{ width:500px; margin:20px auto; } .box ul{ list-style: none; } .box ul li{ width:200px; height: 50px; text-align: center; line-height: 50px; border:1px solid #ccc; } .cur{ background-color:#000; color:#fff;} .cur a{color:#fff;}</style></head><body> <!-- 这里放的是示例代码 --><div class='box'><ul><li></li> <li></li><li></li></ul></div></body><script type="text/javascript">$(function(){$('div.box ul li').click(function(){$(this).addClass('cur').siblings().removeClass('cur');});})</script></html>2015-06-17
其实我理解你大概的要求，我写了一个简单的效果如下，另外，看了这个问题的评论，点击链接后是会发生跳转的，这个效果还有必要么？
HTML：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<html>
<head>
<script type="text/javascript" src="../jquery-1.9.1.min.js"></script>
<title>无标题文档</title>
<style type="text/css">
a{ color:#000;}
.box{
width:500px;
margin:20px auto;
}
.box ul{ list-style: none; }
.box ul li{
width:200px;
height: 50px;
text-align: center;
line-height: 50px;
border:1px solid #ccc;
}
.cur{ background-color:#000; color:#fff;}
.cur a{color:#fff;}
</style>
</head>
<body>
<!-- 这里放的是示例代码 -->
<div class='box'>
<ul>
<li>
</li>
<li>
</li>
<li>
</li>
</ul>
</div>
</body>
<script type="text/javascript">
$(function(){
$('div.box ul li').click(function(){
$(this).addClass('cur').siblings().removeClass('cur');
});
})
</script>
</html>2015-10-01
var li = document.getElmtentByid("menu").getElementsByTagName("li");
li.onclick = function(){this.parent.chield.removeClass('cur');this.addClass('cur');}能理解不，就是this的爸爸的儿子移除class，也就是他兄弟移除class，然后this加上class，点哪加哪！2015-06-24
JS修改CSS设置的样式 
