var myid = document.getElementById('con');
var myid1 = document.getElementById('txt');
//定义"改变颜色"的函数
function myColor(){
myid.style.color ='blue';
myid.style.backgroundColor = 'red';
};
//定义"改变宽高"的函数
function myWidth(){
myid1.style.width = '300px';
};
//定义"隐藏内容"的函数
function mynoneContent(){
myid.style.display = 'none';
};
//定义"显示内容"的函数
function myblockContent(){
myid.style.display ='block';
};
//定义"取消设置"的函数
function myconfirm(){
var my = confirm('是否取消所有操作?')
if(my == true){
myid.removeAttribute("style");; //取消颜色
//myid.style.backgroundColor = '';//去向背景颜色
myid1.removeAttribute("style");;//取消宽度
//myid.style.display = 'block';//取消影藏
}else{
alert('什么都没有改变')
}
};
因为reset()是系统默认方法,所以方法名改成clean就成功了。
点击取消设置,没有任何反应?
我用你的方式怎么不对呢?
<form>
<input type="button" value="改变颜色" onclick="changeColor()">
<input type="button" value="改变宽高" onclick="changeHeight()">
<input type="button" value="隐藏内容" onclick="hide()" >
<input type="button" value="显示内容" onclick="show()" >
<input type="button" value="取消设置" onclick="reset()" >
</form>
<script type="text/javascript">
var title = document.getElementById("con")
var txt = document.getElementById("txt")
function changeColor(){
title.style = "color:red;";
}
function changeHeight(){
txt.style = "height: 300px; width: 400px;"
}
function hide(){
title.style = "display: none;"
}
function show(){
title.style = "display: block;"
}
function reset(){
var res = window.confirm("是否重置样式");
if(res == true){
title.removeAttribute("style");
txt.removeAttribute("style");
}else{
alert('什么都没有改变')
}
}
</script>