比较笨的方法，供参考-慕课网

比较笨的方法，供参考

来源：4-1 编程挑战

kissunshine

2015-07-29 14:11

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<title>JS编程总结练习</title>
	<style type="text/css">
		p{
			color:yellow;
			background-color: #ccc;
			width:500px;
			height:300px;
			border:1px solid black;
			}
	</style>
</head>
<body>
	<p id="id01" class="cl01">
	看灰色的天,慢慢向身后在倾斜,我没有终点,也许是爱旅途的感觉,自由明显,为何快乐那么隐约,喧嚣的边缘,为何没发现那条孤独的界线,打在脸上的雨点模糊了视线,我多像飘在风中的落叶,我看见到处都是空白的世界,谁的脸都只是冷漠的风景线,我不知道幸福在哪一边,也许我要的爱只是一瞬间.</p>
	<script type="text/javascript">
		function ch_color(){
			var ch01=document.getElementById("id01");
			ch01.style.color="red";
			ch01.style.backgroundColor="pink";
		}
		function ch_width_height(){
			var ch02=document.getElementById("id01");
			ch02.style.width="1000px";
			ch02.style.height="150px";
		}
		function ch_display_off(){
			var ch03=document.getElementById("id01");
			ch03.style.display="none";
		}
		function ch_display_on(){
			var ch04=document.getElementById("id01");
			ch04.style.display="block";
		}
		function ch_all(){
			var mes=confirm("确认取消所有设置？");
			if(mes)
			{
				var reset_cfg=document.getElementById("id01");
				reset_cfg.style.color="yellow";
				reset_cfg.style.width="500px";
				reset_cfg.style.height="300px";
			}
		}
	</script>
	<form>
		<input type="button" name="改变颜色" value="改变颜色" onclick="ch_color()" />
		<input type="button" name="改变宽高" value="改变宽高" onclick="ch_width_height()" />
		<input type="button" name="隐藏内容" value="隐藏内容" onclick="ch_display_off()" />
		<input type="button" name="显示内容" value="显示内容" onclick="ch_display_on()" />
		<input type="button" name="取消设置" value="取消设置" onclick="ch_all()" />
	</form>
</body>
</html>

写回答关注