为了账号安全,请及时绑定邮箱和手机立即绑定

JavaScript进阶篇

难度入门
时长 8小时55分
学习人数
综合评分9.47
2557人评价 查看评价
9.7 内容实用
9.4 简洁易懂
9.3 逻辑清晰
  • MATH对象


    查看全部
    0 采集 收起 来源:Math对象

    2020-02-18

  • DATE对象


    查看全部
    0 采集 收起 来源: Date 日期对象

    2020-02-18

  • 插入一个节点

      var otest = document.getElementById("test");  

      var newnode = document.createElement("li");

      newnode.innerHTML ="Hi I'm Eric";

      otest.appendChild(newnode); 


    查看全部
  • var Myarr = [[0 , 1 , 2 ],[1 , 2 , 3]]

    查看全部
    0 采集 收起 来源:二维数组

    2020-02-17

  • 日期对象表

    查看全部
    0 采集 收起 来源: Date 日期对象

    2020-02-17

  •    checkbox  选择代码

            function checkone(){

                var j=document.getElementById("wb").value;

                var hobby = document.getElementsByName("hobby");

                for(var i=0;i<hobby.length;i++)

                {

                    if(i!=j-1 && hobby[i].type == "checkbox")

                        {

                        hobby[i].checked=false;

                        }

                    else if(i==j-1 && hobby[i].type == "checkbox")

                    {

                        hobby[i].checked=true;

                    }

                }

             // 任务3

            

            }


    查看全部
  • 鼠标时间表

    查看全部
    0 采集 收起 来源:什么是事件

    2020-02-17

  • 注意区别

    var mynode= document.getElementsByName("myt");  

    var mynode= document.getElementById("myt");  


    ById 只有一个 所以是 getElement ...

    ByName不唯一 所以是 getElements...

    注意单复数 加s


    查看全部
  • 获取及修改节点属性 


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

        hh.style.color = "green";

        hh.style.backgroundColor = "#CCC";

        hh.style.display = "block";

        document.write(hh.nodeName);


    查看全部
    0 采集 收起 来源:认识DOM

    2020-02-17

  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>无标题文档</title>

    </head>

    <body>

    <form>

    请选择你爱好:<br>

    <input type="checkbox" name="hobby" id="hobby1">  音乐

    <input type="checkbox" name="hobby" id="hobby2">  登山

    <input type="checkbox" name="hobby" id="hobby3">  游泳<br/>

    <input type="checkbox" name="hobby" id="hobby4">  阅读

    <input type="checkbox" name="hobby" id="hobby5">  打球

    <input type="checkbox" name="hobby" id="hobby6">  跑步 <br>

    <input type="button" value = "全选" onclick = "checkall();">

    <input type="button" value = "全不选" onclick = "clearall();">

    <p>请输入您要选择爱好的序号,序号为1-6:</p>

    <input id="wb" name="wb" type="text" >

    <input name="ok" type="button" value="确定" onclick = "checkone();">

    <input name="cancel" type="button" value="取消" onclick = "clean();">

    </form>

    <script type="text/javascript">

    // 任务1

    function checkall(){

    var hobby = document.getElementsByTagName("input");

    for(var i=0;i<hobby.length;i++)

    if(hobby[i].type=="checkbox")

    hobby[i].checked=true;

    }

    // 任务2  

    function clearall(){

    var hobby = document.getElementsByName("hobby");

    for(var i=0;i<hobby.length;i++)

    if(hobby[i].type=="checkbox")

    hobby[i].checked=false;

    }

    // 任务3      

    function checkone(){

    var j=document.getElementById("wb").value;

    var hobby = document.getElementsByName("hobby");

    switch(parseInt(j)){

    case 1:hobby[0].checked=true; break;

    case 2:hobby[1].checked=true; break;

    case 3:hobby[2].checked=true; break;

    case 4:hobby[3].checked=true; break;

    case 5:hobby[4].checked=true; break;

    case 6:hobby[5].checked=true; break;

    default:alert("请重新输入(1-6)的数字!");

    }

    }

    function clean(){

    var hobby=document.getElementsByName("hobby");

    for(var i=0;i<hobby.length;i++){

    hobby[i].checked=false;

    }

    document.getElementById("wb").value="";

    }

    </script>


    </body>


    </html>


    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>style样式</title>

    </head>

    <body>

    <h2 id="con">I love JavaScript</H2>

    <p> JavaScript使网页显示动态效果并实现与用户交互功能。</p>

    <script type="text/javascript">

    function hide(){


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


    d.style.display="none";


    }


    function show(){


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


    d.style.color="red";


    d.style.backgroundColor="#ccc";


    d.style.display="block";


    }


    </script>


    <input type="button" onclick="hide()" value="隐藏" />


    <input type="button" onclick="show()" value="显示" />



    </body>

    </html>


    查看全部
    0 采集 收起 来源:认识DOM

    2020-02-16

  • 能看懂,但是写想不到......


    <!DOCTYPE html>

    <html>

     <head>

      <title>浏览器对象</title>  

      <meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>   

     </head>

     <body>

      <H4>操作成功</H4>

      <p>

         <b id="second">5</b>秒后回到主页&nbsp;<a href="javascript:goBack();">返回</a>  

      </p>

     

    <script type="text/javascript">  

     

    var sec = document.getElementById("second");

    var i = 5;

    var timer = setInterval(function(){

    i--;

    sec.innerHTML = i;

    if(i==1){

    window.location.href =  "http://www.imooc.com/";

    }

    },1000);

     

      function goBack(){ 

    window.history.go(-1);

      }  

      </script> 

     </body>

    </html>


    查看全部
    0 采集 收起 来源:编程练习

    2020-02-16

  • <!DOCTYPE html>

    <html>

     <head>

      <title>浏览器对象</title>  

      <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>   

     </head>

     <body>

      <!--先编写好网页布局-->

      <h3>操作成功</h3>

      <p><span id="sqtimen"></span>秒后回到首页<a href="#" onclick="goback()">返回</a></p>

      <script type="text/javascript">  

     var num=5;

     function change(){

        

        if(num==0){

        clearTimeout(i);

         location.assign("https://www.imooc.com");

        }

        else{

        document.getElementById("sqtimen").innerText=num;

        num=num-1;

        var i=setTimeout(change,1000);

        }

       //获取显示秒数的元素,通过定时器来更改秒数。


       //通过window的location和history对象来控制网页的跳转。

        function goback(){

       window.history.back();

       }

    }   

        change();

     </script> 

    </body>

    </html>


    查看全部
    0 采集 收起 来源:编程练习

    2020-02-16

  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>无标题文档</title>

    </head>

     <script type="text/javascript">

            function GoBack() {

                window.history.go(1);

            }


            function GoForward() {

                window.history.go(-1);

            }

        </script>


    <body>

        点击下面的锚点链接,添加历史列表项:    

        <br />

        <a href="#target1">第一个锚点</a>

        <a name="target1"></a>

        <br />

        <a href="#target2">第二个锚点</a>

        <a name="target2"></a>

        <br /><br />

        使用下面按钮,实现返回前或下一个页面:

        <form>

           <input type="button"  value="返回前一个页面" onclick="GoBack();" />

           <input type="button"  value="返回下一个页面" onclick="GoForward();" /> 

        </form>

    </body>

    </html>


    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>无标题文档</title>

    </head>

     <script type="text/javascript">

            function GoForward() {

            window.history.go(1);    

            }

    function GoBack() {

            window.history.back();    

            }

        </script>

    </head>

    <body>

    点击下面的锚点链接,添加历史列表项:    

        <br />

        <a href="#target1">第一个锚点</a>

        <a name="target1"></a>

        <br />

        <a href="#target2">第二个锚点</a>

        <a name="target2"></a>

        <br /><br />

        使用下面按钮,实现返回下一个页面:

        <form>

           <input type="button"  value="返回下一个页面" onclick="GoForward()" /> 

           <input type="button"  value="返回前一个页面" onclick="GoBack();" />       

        </form>

    </body>

    </html>



    查看全部

举报

0/150
提交
取消
课程须知
你需要具备HTML、css基础知识,建议同学们也可以想学习下js入门篇,快速认识js,熟悉js基本语法,更加快速入手进阶篇!
老师告诉你能学到什么?
通过JavaScript学习,掌握基本语法,制作简单交互式页面

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!