<!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>
可以的。