问答详情
源自:4-1 编程挑战

看不出哪里错了,求大神指导

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />

<title>javascript</title>

<style type="text/css">

body{font-size:12px;}

#txt{

    height:400px;

    width:600px;

border:#333 solid 1px;

padding:5px;}

p{

line-height:18px;

text-indent:2em;}

</style>

</head>

<body>

  <h2 id="con">JavaScript课程</H2>

  <div id="txt"> 

     <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>

        <p>1. JavaScript入门篇,让不懂JS的你,快速了解JS。</p>

        <p>2. JavaScript进阶篇,让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>

        <p>3. 学完以上两门基础课后,在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>

  </div>

  <form>

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

    <input type="button" onClick = "colorChange()" value="改变颜色" >  

    <input type="button" onClick = "sizeChange()" value="改变宽高" >

    <input type="button" onClick = "hideText()" value="隐藏内容" >

    <input type="button" onClick = "showText()" value="显示内容" >

    <input type="button" onClick = "cancle()"    value="取消设置" >

  </form>

  <script type="text/javascript">

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

function colorChange(){

   document.getElementById("txt").style.color = "blue";

}


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

function sizeChange(){

    document.getElementById("txt").style.width = "300";

    document.getElementById("txt").style.height = "50";

}


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

function hideText(){

    document.getElementById("txt").style.display = "none";

   

}


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

function showText(){

   document.getElementById("txt").style. display = "block";

}

 

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

function cancel(){

    var quxiao = confirm(确认取消吗?)

    if (quxiao==true){

        document.getElementById("txt"). removeAttribute("style");  

        

    }

}



  </script>

</body>

</html>


提问者:慕村8122917 2016-06-07 15:40

个回答

  • 专注dj30年
    2016-06-07 16:13:08
    已采纳

    在取消设置函数里你忘了加双引号,改变宽高后忘了加单位,调用函数cancel()写错

  • 我要开发地图系统
    2016-06-11 16:52:29

    你好!

    编写代码过程中出现失误在所难免,

    那,有没有方法避免这个问题呢?

    答案是:有的

    用编辑器吧,有什么错误,它都会告诉你。

    EditPlus 4     特好用,自己百度下载。



    575bd1450001ea8d05000551.jpg

    575bd1460001406d05000167.jpg

    575bd1470001141e05000362.jpg


  • 后知后觉28
    2016-06-07 16:56:54

    你的点击事件应该先指出来是onClick事件再给它起名字value,你弄反了它就找不到了。

  • 专注dj30年
    2016-06-07 16:10:53

    <!DOCTYPE HTML>
    <html>
    <head>
       <meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
       <title>javascript</title>
       <style type="text/css">
           body{font-size:12px;}
           #txt{
               height:400px;
               width:600px;
               border:#333 solid 1px;
               padding:5px;}
           p{
               line-height:18px;
               text-indent:2em;}
       </style>
    </head>
    <body>
    <h2 id="con">JavaScript课程</H2>
    <div id="txt">
       <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>
       <p>1. JavaScript入门篇,让不懂JS的你,快速了解JS。</p>
       <p>2. JavaScript进阶篇,让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>
       <p>3. 学完以上两门基础课后,在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>
    </div>
    <form>
       <!--当点击相应按钮,执行相应操作,为按钮添加相应事件-->
       <input type="button" onClick = "colorChange()" value="改变颜色" >
       <input type="button" onClick = "sizeChange()" value="改变宽高" >
       <input type="button" onClick = "hideText()" value="隐藏内容" >
       <input type="button" onClick = "showText()" value="显示内容" >
       <input type="button" onClick = "cancel()"    value="取消设置" >
    </form>
    <script type="text/javascript">
       //定义"改变颜色"的函数
       function colorChange(){
           document.getElementById("txt").style.color = "blue";
       }

       //定义"改变宽高"的函数
       function sizeChange(){
           document.getElementById("txt").style.width = "300px";
           document.getElementById("txt").style.height = "50px";
       }

       //定义"隐藏内容"的函数
       function hideText(){
           document.getElementById("txt").style.display = "none";

       }

       //定义"显示内容"的函数
       function showText(){
           document.getElementById("txt").style. display = "block";
       }

       //定义"取消设置"的函数
       function cancel(){
           var quxiao = confirm("确认取消吗?");
           if (quxiao==true){
               document.getElementById("txt"). removeAttribute("style");
           }
       }


    </script>
    </body>
    </html>