为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
JavaScript进阶篇_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

JavaScript进阶篇

慕课官方号 页面重构设计
难度入门
时长 8小时55分
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>获得星期</title>

    <script type="text/javascript">

      var mydate=new Date();

      var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];

      document.write("今天是:" + weekday[mydate.getDay()]);

    </script>

    </head>

    <body>

    </body>

    </html>

    查看全部
    0 采集 收起 来源:返回星期方法

    2023-02-28

  • <!DOCTYPE html>

    <html>

    <head>

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

    <title>获得年份 </title>

    <script type="text/javascript">

    var mydate=new Date(); 

    var myyear= mydate.getFullYear()    ;

    document.write("年份:"+myyear);

    </script>

    </head>

    <body>

    </body>

    </html>

    查看全部
  • var Udate=new Date();

    注意:使用关键字new,Date()的首字母必须大写。 

    使 Udate 成为日期对象,并且已有初始值:当前时间(当前电脑系统时间)。


    var d = new Date(2012, 10, 1);  //2012年10月1日

    var d = new Date('Oct 1, 2012'); //2012年10月1日

    我们最好使用下面介绍的“方法”来严格定义时间。

    访问方法语法:“<日期对象>.<方法>”

    Date对象中处理时间和日期的常用方法:

    get/setDate()       返回/设置日期

    get/setFullYear()  返回/设置年份,用四位数表示  

    get/setYear()       返回/设置年份

    get/setMonth()    返回/设置月份

    get/setHours()     返回/设置小时,24小时制

    get/setMinutes()  返回/设置分钟数

    get/setSeconds() 返回/设置秒钟数

    get/setTime()       返回/设置时间(单位毫秒)

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

    2023-02-28

  • <!DOCTYPE html>

    <html>

    <head>

        <title> 事件</title>

        <script type="text/javascript">

            function count() {

                //获取第一个输入框的值

                var v1 = parseInt(document.getElementById("txt1").value);

                //获取第二个输入框的值

                var v2 = parseInt(document.getElementById("txt2").value);

                //获取选择框的值

                var s = document.getElementById("select").value;

                //获取通过下拉框来选择的值来改变加减乘除的运算法则

                var r;

                switch (s) {

                    case "+":

                        r = v1 + v2;

                        break;

                    case "-":

                        r = v1 - v2;

                        break;

                    case "*":

                        r = v1 * v2;

                        break;

                    case "/":

                        r = v1 / v2;

                        break;

                }

                //设置结果输入框的值

                document.getElementById("fruit").value = r;

            }

        </script>

    </head>

    <body>

    <script type="text/javascript">

    </script>

    <input type='text' id='txt1' value="3"/>

    <select id='select'>

        <option value='+'>+</option>

        <option value="-">-</option>

        <option value="*">*</option>

        <option value="/">/</option>

    </select>

    <input type='text' id='txt2' value="4"/>

    <input type='button' value=' = ' onclick="count()"/> <!--通过 = 按钮来调用创建的函数,得到结果-->

    <input type='text' id='fruit'/>

    </body>

    </html>

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

    2023-02-28

  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title> 卸载事件 </title>

    <script type="text/javascript">   

         window.onunload = onunload_message;   

         function onunload_message(){   

            alert("您确定离开该网页吗?");   

        }   

    </script>   

    </head>

    <body>

      欢迎学习JavaScript。

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title> 加载事件 </title>

    <script type="text/javascript">

      function message(){

        alert("加载中,请稍等…"); }

    </script>    

    </head>

    <body onload="message()">

      欢迎学习JavaScript。

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title> 内容选中事件 </title>

    <script type="text/javascript">

      function message(){

        alert("您触发了选中事件!"); }

    </script>    

    </head>

    <body>

      <form>

      个人简介:<br>

       <textarea name="summary" cols="60" rows="5" onselect="message()">请写入个人简介,不少于200字!</textarea>

      </form>

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title> 失焦事件 </title>

    <script type="text/javascript">

      function message(){

        alert("请确定已输入密码后,在移开!"); }

    </script>    

    </head>

    <body>

      <form>

       用户:<input name="username" type="text" value="请输入用户名!" >

       密码:<input name="password" type="text" value="请输入密码!" onblur="message()">

      </form>

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>鼠标移开事件 </title>

    <script type="text/javascript">

      function message(){

        alert("不要移开,点击后进行慕课网!"); }

    </script>

    </head>

    <body>

    <form onmouseout="message()">

      <a href="http://www.imooc.com">点击我</a>

    </form>

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title> 鼠标经过事件 </title>

    <script type="text/javascript">

        function message(){

          confirm("请输入密码后,再单击确定!"); }

    </script>

    </head>

    <body>

    <form>

    密码:<input name="password" type="password" >

    <input name="确定" type="button" value="确定" onmouseover="message()"/>

    </form>

    </body>

    </html>

    查看全部
  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>单击事件 </title>

    <script type="text/javascript">

      function openwin(){

         window.open('http://www.imooc.com','_blank','height=600,width=400,top=100,toolbar=no,left=0,menubar=no,scrollbars=no,status=no');}

    </script>

    </head>

    <body>

      <form>

        <input name="点击我" type="button" value="点击我" onclick="openwin()"/>

      </form>

    </body>

    </html>

    查看全部
  • 主要事件表:

    onclick           鼠标点击事件

    onmouseover 鼠标经过事件

    onmouseout   鼠标移开事件

    onchange       文本框内容改变事件

    onselect         文本框内容被选中事件

    onfocus          光标聚合

    onblur            光标离开

    onload            网页导入

    onunload        关闭网页

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

    2023-02-28

  • <!DOCTYPE  HTML>

    <html >

    <head>

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

    <title>函数</title>

    <script type="text/javascript">

    //定义函数

    function showMax(x, y) {

        if(x > y) {

            alert(x + " > " + y);

        } else if (x == y) {

            alert(x + " == " + y)

        } else {

            alert(x + " < " + y);

        }

    }

    //showMax(7,8);

    //函数体,判断两个整数比较的三种情况

    function max(x, y) {

        if(x >= y) {

            return x;

        } else {

            return y;

        }

    }

     

    //调用函数,实现下面两组数中,返回较大值。

      document.write(" 5 和 4 的较大值是:"+ max(5,4)+"<br>");

      document.write(" 6 和 3 的较大值是:" + max(6,3)); 

    </script>

    </head>

    <body>

    </body>

    </html>

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

    2023-02-28

  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>返回值函数</title>

    <script type="text/javascript">

      function  app2(x,y)

      { var sum,x,y;

        sum = x * y;

        return sum;

      }

      var req1 = app2(5, 6);

      var req2 = app2(2, 3);

      var sumq = req1 + req2;

    document.write("req1的值:"+req1+"<br/>");

    document.write("req2的值:"+req2+"<br/>");

    document.write(req1+"与"+req2+"和:"+sumq);

    </script>

    </head>

    <body>

    </body>

    </html>

    查看全部
    0 采集 收起 来源:返回值的函数

    2023-02-28

  • <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>函数传参</title>

    <script type="text/JavaScript">

       function add3(x, y, z)                

    {

     sum = x + y +z;

     document.write(x+"、"+y+"、"+z+"和:"+sum+"<br/>");

    }

    // 直接调用函数 

    add3(5, 8, 3);

    add3(7, 1, 4);

    </script>

    </head>

    <body>

    </body>

    </html>

    查看全部
    0 采集 收起 来源:有参数的函数

    2023-02-28

举报

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

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