码迷,mamicode.com
首页 > Web开发 > 详细

JS控制css

时间:2014-05-14 03:18:51      阅读:264      评论:0      收藏:0      [点我收藏+]

标签:style   blog   class   c   color   width   

<style>
#div1 {position:absolute;left:20px;top:30px;width:20px;height:30px;background-color:red}
.red{color: red}
.blue{color: blue}
</style>
		<script>	
			var d = 100;
			function test() {
				var a = document.getElementById("div1");
				a.style.backgroundColor = "blue";
				d += 10;
				a.style.left = d+"px";
				 	
			  
			}
		</script>
		<script>	
			var d = 100;
			function test1() {
				var a = document.getElementById("div1");
				a.style.backgroundColor = "blue";
				d += 10;
				a.style.left = d+"px";
				 	
			  
			}
			function test2() {
			  var a = document.getElementById("div0");
			  a.className =  "blue";//样式的装换
			}
		</script>
	
	<body onkeypress="ff(event)">
		<!-- <input type="button" value="测试" onclick="ff(event)"> -->
		<div id = div0 class = "red">aaaa</div>
		<div id =  div1>
		</div>
		<input type="button" value="测试1" onclick="test1()">
		<input type="button" value="测试2" onclick="test2()">
		
	</body>    

 

JS控制css,布布扣,bubuko.com

JS控制css

标签:style   blog   class   c   color   width   

原文地址:http://www.cnblogs.com/zhujiabin/p/3722019.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!