爆炸,五个按钮一个都没用,关键还找不到问题在哪里 ?。?

来源:4-1 编程挑战

二十七杯酒3976242

2017-08-13 21:56

<!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" value="改变颜色" onClick="changeColor()">  

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

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

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

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

  </form>

  <script type="text/javascript">

        var con=document.getElementById("con");

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

   function changeColor(){

           

            //con.style.color="#100000";

            //con.style.backgroundColor="#000000";

           // txt.style.color="red";;

            txt.style.backgroundColor="#000000";

        }


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

    function changeHeight(){

         

         //con.style.width="200px";

         //con.style.height="100px";

         txt.style.width="500px";

         txt.style.height="500px";

    }


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

    function hides(){

         

         //con.style.display="none";

         txt.style.display="none";

    }


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

    function shows(){

         

        // con.style.display="block";

         txt.style.display="block";

    }


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

    function cancel(){

        var tk=confirm("是否取消?")

        if(tk==ture) {

            tk.removeAttribute("style");

        }

  </script>

</body>

</html>



写回答 关注

4回答

  • qq_一个人的路上_0
    2017-08-15 11:37:28
    已采纳

    <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html lang="en"> <head>  <meta charset="UTF-8">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <title>Document</title>  <script src="jquery-3.2.1.js">  </script>  <style type="text/css">  #div1{width:300px;height:300px;}  </style> </head> <body>  <div id="div1" style="background:red;"><h3>111111</h3></div>  <input type="button" onClick="abc()" value="annie"/>    <script type="text/javascript"> var div1=document.getElementById("div1"); alert(div1);    function abc(){ a = confirm("是否要清除");        if(a==true) {            div1.removeAttribute("style");        }    }  </script> </body></html>

    二十七杯酒3...

    非常感谢!

    2017-08-15 16:15:11

    共 2 条回复 >

  • web小菜
    2017-08-15 11:18:43

    <!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" value="改变颜色" onclick="changeColor()">  

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

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

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

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

      </form>

      <script type="text/javascript">

            var con=document.getElementById("con");

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

       function changeColor(){

               

        //con.style.color="#100000";

        //con.style.backgroundColor="#000000";

       // txt.style.color="red";;

        txt.style.color="red";

       }


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

        function changeHeight(){

             

             //con.style.width="200px";

             //con.style.height="100px";

             txt.style.width="500px";

             txt.style.height="500px";

        }


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

        function hides(){

             

             //con.style.display="none";

             txt.style.display="none";

        }


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

        function shows(){

             

            // con.style.display="block";

             txt.style.display="block";

        }


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

        function cancel(){

            var tk=confirm("是否取消?")

            if(tk=true) {

                txt.removeAttribute("style");

            }

        }

      </script>

    </body>

    </html>


  • web小菜
    2017-08-15 11:06:48

    就最后少了一个大括号,改回来,有用了,就是最后一个取消设置没有用。

    qq_一个人...

    我也调了很久,愣是找不到为什那个按钮没有用

    2017-08-15 11:36:32

    共 1 条回复 >

  • 慕的地609158
    2017-08-13 23:25:02

    哥 你没定义变量 并且变量没取值,应该像这样写:

     function changeColor(){

        var chclo = document.getElementById("txt").style.color="red";

      }


    web小菜 回复二十七杯酒3...

    最后一个少了个} function cancel(){ var tk=confirm("是否取消?") if(tk==ture) { txt.removeAttribute("style"); } } 这样就可以了

    2017-08-15 11:20:07

    共 4 条回复 >

JavaScript入门篇

JavaScript做为一名Web工程师的必备技术,本教程让您快速入门

739817 学习 · 9566 问题

查看课程

相似问题