<form> <!--当点击相应按钮,执行相应操作,为按钮添加相应事件--> <input type="button" value="改变颜色" onclick="col()"/> <input type="button" value="改变宽高" onclick="wihi()"/> <input type="button" value="隐藏内容" onclick="hide()"/> <input type="button" value="显示内容" onclick="block()"/> <input type="button" value="取消设置" onclick="reset()"/> </form> <script type="text/javascript"> //定义"改变颜色"的函数 var mychar=document.getElementById("txt"); function col(){ mychar.style.color="red"; mychar.style.backgroundColor="#ccc"; } //定义"改变宽高"的函数 function wihi(){ mychar.style.width="300px"; mychar.style.height="200px"; } //定义"隐藏内容"的函数 function hide(){ mychar.style.display="none"; } //定义"显示内容"的函数 function block(){ mychar.style.display="block"; } //定义"取消设置"的函数 function reset(){ var str=confirm("重置样式设置吗?"); if(str==true){ mychar.removeAttribute('style'); } }
相关分类