<form>
<!--当点击相应按钮，执行相应操作，为按钮添加相应事件-->
<input type="button" value="改变颜色" onClick="changecolor()" >
<input type="button" value="改变宽高" onClick="change()">
<input type="button" value="隐藏内容" onClick="tt()">
<input type="button" value="显示内容" onClick="aa()">
<input type="button" value="取消设置" onClick="quxiao()">
</form>
<script type="text/javascript">
//定义"改变颜色"的函数
function changecolor()
{
var ccolor=document.getElementById("txt");
ccolor.style.color="red";
ccolor.style.background="yellow";
}
//定义"改变宽高"的函数
function change()
{
var c1=document.getElementById("txt");
c1.style.width="250px";
c1.style.height="300px";
}
//定义"隐藏内容"的函数
function tt()
{
var td=document.getElementById("txt");
td.style.display="none";
}
//定义"显示内容"的函数
function aa()
{
var a=document.getElementById("txt");
a.style.display="block";
}
}
//定义"取消设置"的函数
function quxiao()
{ var qx=document.getElementById("txt");
var message=confirm("真的要取消吗？")；
if(message=true)
{
qx.style.cssText="none";
}
}
<!--当点击相应按钮，执行相应操作，为按钮添加相应事件-->
<input type="button" value="改变颜色" onclick="changecolor()" >
<input type="button" value="改变宽高" onclick="change()">
<input type="button" value="隐藏内容" onclick="tt()">
<input type="button" value="显示内容" onclick="aa()">
<input type="button" value="取消设置" onclick="quxiao()">
</form>
<script type="text/javascript">
var element=document.getElementById("txt");
//定义"改变颜色"的函数
function changecolor()
{
element.style.color="red";
element.style.backgroundColor="yellow";
}
//定义"改变宽高"的函数
function change()
{
element.style.width="250px";
element.style.height="300px";
}
//定义"隐藏内容"的函数
function tt()
{
element.style.display="none";
}
//定义"显示内容"的函数
function aa()
{
element.style.display="block";
}
//定义"取消设置"的函数
function quxiao()
{
var message=confirm("真的要取消吗？");
if(message)
{
element.style.cssText="none";
}
}
你第一个函数里面已经定义了 var ccolor=document.getElementById("txt"); 后面再继续定义不仅麻烦还无效吧，为什么不直接定义一个后面直接调用？