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

JavaScript进阶篇

慕课官方号 页面重构设计
难度入门
时长 8小时55分
  • 提取指定数目的字符substr()

    substr() 方法从字符串中提取从 startPos位置开始的指定数目的字符串。

    语法:

    stringObject.substr(startPos,length)

    参数说明:


    查看全部
  • 提取字符串substring()

    substring() 方法用于提取字符串中介于两个指定下标之间的字符。

    语法:

    stringObject.substring(startPos,stopPos)


    查看全部
  • 字符串分割split()

    知识讲解:

    split() 方法将字符串分割为字符串数组,并返回此数组。

    语法:

    stringObject.split(separator,limit)


    查看全部
  • indexOf可返回某个指定的字符串值在字符串中首次出现的位置。

    语法

    stringObject.indexOf(substring, startpos)

    查看全部
  • getDay() 返回星期,返回的是0-6的数字,0 表示星期天。如果要返回相对应“星期”,通过数组完成,代码如下:

    <script type="text/javascript">
      var mydate=new Date();//定义日期对象
      var weekday=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];//定义数组对象,给每个数组项赋值
      var mynum=mydate.getDay();//返回值存储在变量mynum中  document.write(mydate.getDay());//输出getDay()获取值
      document.write("今天是:"+ weekday[mynum]);//输出星期几</script>


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

    2019-08-28

  • charAt() 方法可返回指定位置的字符。返回的字符是长度为 1 的字符串。

    查看全部
  • 串表达式:值为字符串;

    数值表达式:值为数值;

    布尔表达式:值为true或false

    查看全部
    1. 数值    var num=666;

    2. 字符串    var txt="abcd";

    3. 布尔值    var bo=true;

    查看全部
  • 声明变量语法: var 变量名;

    注意:变量也可以不声明,直接使用,但为了规范,需要先声明,后使用。

    查看全部
    1. 必须以字母、下划线或美元符号开头,后面可以跟字母、下划线、美元符号和数字。

    2. 变量名区分大小写,如:A与a是两个不同变量。

    3. 不允许使用JavaScript关键字和保留字做变量名。

    查看全部
  • 选项卡


    <!DOCTYPE HTML>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>无标题文档</title>
            <style type="text/css">
                *{
                    margin: 0px; padding: 0px; font: 12px normal; font-family: 微软雅黑;
                }
                
                #tabs{
                    width: 290px;
                    height: 150px;
                    margin: 20px;
                    padding: 5px;
                }
                
                #tabs ul{
                    list-style: none;
                    display: block;
                    height: 30px;
                    line-height: 30px;
                }
                
                #tabs ul li{
                    display: inline-block;
                    width: 60px;
                    height: 28px;
                    border: 1px solid #aaa;
                    text-align: center;
                    line-height: 28px;
                    border-bottom: none;
                    margin: 0px 3px;
                    float: left;
                    background: #fff;
                    cursor: pointer;
                }
                
                #tabs ul li.on{
                    border-top: 2px solid saddlebrown;
                    border-bottom: 2px solid #FFFFFF;
                }
                
                #tabs div{
                    height: 120px;
                    line-height: 25px;
                    border: 1px solid #369;
                    border-top: 2px saddlebrown solid;
                    padding: 5px;
                }
                .hide{
                    display: none;
                }
            </style>
            
            <script >
                window.onload = function(){
                    var aTab=document.getElementById("tabs");
                    var li=document.getElementsByTagName("li");
                    var div=aTab.getElementsByTagName("div");
                    
                    for (let i = 0; i < li.length; i++) {
                        li[i].index=i;
                        li[i].onclick = function(){
                            //再注册一个点击事件,当点击的时候所有标签都恢复最初状态
                            for(var n=0;n<li.length;n++){
                                li[n].className="";
                                div[n].className="hide";
                            }
                            this.className = "on";
                            div[this.index].className=""
                        }
                    }
                }
                
            </script>
            
        </head>
        <body>

            <!-- HTML页面布局 -->
            <div id="tabs">
                <ul>
                    <li class="on">房产</li>
                    <li>家居</li>
                    <li>二手房</li>
                </ul>
                <div>
                275万购昌平邻铁三居 总价20万买一居<br>
                200万内购五环三居 140万安家东三环<br>
                北京首现零首付楼盘 53万购东5环50平<br>
                京楼盘直降5000 中信府 公园楼王现房<br>
                </div>
                <div class="hide">
                40平出租屋大改造 美少女的混搭小窝<br>
                经典清新简欧爱家 90平老房焕发新生<br>
                新中式的酷色温情 66平撞色活泼家居<br>
                瓷砖就像选好老婆 卫生间烟道的设计<br>
                </div>
                <div class="hide">
                通州豪华3居260万 二环稀缺2居250w甩<br>
                西3环通透2居290万 130万2居限量抢购<br>
                黄城根小学学区仅260万 121平70万抛!<br>
                独家别墅280万 苏州桥2居优惠价248万<br>
                </div>

        </body>
    </html>

    查看全部
    0 采集 收起 来源:编程挑战

    2019-08-28

  • 注意:write里(mydate.getMonth()+1)外面()表示先运行括号里的。

    write里" "表示空格。

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

    2019-08-28

  • <script type="text/javascript">
      function sortNum(a,b) {
      return a - b;
     //升序,如降序,把“a - b”该成“b - a”
    }
     var myarr = new Array("80","16","50","6","100","1");
      document.write(myarr + "<br>");
      document.write(myarr.sort(sortNum));
    </script>

    注意:为什么最后面sortNum后没有()

    查看全部
    0 采集 收起 来源: 数组排序sort()

    2019-08-28

  • https://img1.sycdn.imooc.com//5d65e52e0001de7305060391.jpg1111111111111

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

    2019-08-28

  • getDay() 返回星期,返回的是0-6的数字,0 表示星期天。

    dateObject 的月份字段,使用本地时间。返回值是 0(一月) 到 11(十二月) 之间的一个整数。

    注意:0开始!!!

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

    2019-08-28

举报

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

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