<form>

  <!--当点击相应按钮，执行相应操作，为按钮添加相应事件-->

    <input type="button" value="改变颜色" onclick="col()" >  

    <input type="button" value="改变宽高" onclick="wh()"  >

    <input type="button" value="隐藏内容" onclick="hi()"  >

    <input type="button" value="显示内容" onclick="sh()"  >

    <input type="button" value="取消设置" onclick="qx()"  >

  </form>

  <script type="text/javascript">

//定义"改变颜色"的函数

var t=document.getElementById("txt");

function col(){

    t.style.color="red";

    t.style.backgroundColor="#ccc";

}

//定义"改变宽高"的函数

function wh(){

    t.style.width="red";

    t.style.height="#ccc";

}

//定义"隐藏内容"的函数

function hi(){

    t.style.display="none";

}

//定义"显示内容"的函数

function sh(){

    t.style.display="block";

}

//定义"取消设置"的函数

function qx(){

    var con=confirm("确定取消吗？");

    if(con==true){

        t.removeattribute('style');

    }

}

  </script>

这个你看看笔记 都有人贴代码的 不知道的可以多看看他们怎么写的

重置所有样式可用removeAttribute('style')

清除写在标签内的`style`属性中的样式或者后续由js等添加上的样式，而不会清除css的内部样式和外部样式表

文字设为黑色black，背景设为白色white，隐藏属性设为显示block，宽度高度

我只是把颜色设成黑色，宽度也变回去了