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

JavaScript进阶篇

慕课官方号 页面重构设计
难度入门
时长 8小时55分
  • 区别getElementByID,getElementsByName,getElementsByTagName 以人来举例说明,人有能标识身份的身份证,有姓名,有类别(大人、小孩、老人)等。 1. ID 是一个人的身份证号码,是唯一的。所以通过getElementById获取的是指定的一个人。 2. Name 是他的名字,可以重复。所以通过getElementsByName获取名字相同的人集合。 3. TagName可看似某类,getElementsByTagName获取相同类的人集合。如获取小孩这类人,getElementsByTagName("小孩")。 把上面的例子转换到HTML中,如下: <input type="checkbox" name="hobby" id="hobby1"> 音乐 input标签就像人的类别。 name属性就像人的姓名。 id属性就像人的身份证。
    查看全部
  • <!DOCTYPE HTML> <html > <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>系好安全带,准备启航</title> <script type="text/javascript"> //通过javascript的日期对象来得到当前的日期,并输出。 var time=new Date(); var week=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]; document.write(time.getFullYear()+"年"+(time.getMonth()+1)+"月"+time.getDate()+"日"+" "+week[time.getDay()]); //成绩是一长窜的字符串不好处理,找规律后分割放到数组里更好操作哦 var scoreStr = "小明:87;小花:81;小红:97;小天:76;小张:74;小小:94;小西:90;小伍:76;小迪:64;小曼:76"; var scoreArr=scoreStr.split(";"); //从数组中将成绩撮出来,然后求和取整,并输出。 var sum=0; for(var i=0;i<scoreArr.length;i++){ var score=parseInt(scoreArr[i].substring(scoreArr[i].indexOf(":")+1)); sum+=score; } document.write("——班级总分为:"+sum); </script> </head> <body> </body> </html>
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

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

    2017-08-07

  • 在table中隐藏了两个标签分别是 <caption></caption> 和<tbody></tbody>,其格式应该为 <table> <caption></caption> <tbody> <tr><td>...<td><tr> <tr><td>...<td><tr> </tbody> </table>
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

  • 了解成员数量(数组属性length) 如果我们想知道数组的大小,只需引用数组的一个属性length。Length属性表示数组的长度,即数组中元素的个数。 语法: myarray.length; //获得数组长度 var arr=[55,32,5,90,60,98,76,54];//包含8个数值的数组 arr document.write(arr.length); //显示数组长度8 document.write(arr[7]); //显示第8个元素的值54
    查看全部
  • 1、 font:size style family(为字符串)。 2、 在设置选项卡时,几个选项分别用ul-li标签来输出,先设定ul的list-style为none,设置ul合适的高度(之后可以适当调整,使其之后的div内容标签不会受到li浮动的影响,不必清除浮动,这样看起来更美观)。设置li为块状元素,令其左浮动这样就能横向排列了,设置好padding,margin(这也会影响到div内容标签是否会受到li浮动影响),设置好边框,利用border-bottom:none;可以使其无下边框。设置li的背景为纯白色#FFF(这个会影响到选中标签后li下边框是否会呈现白色,设置后有利于美观)然后设置cursor:pointer光标样式。 3、设置好div内容标签的行距line-height,边框设置好利用border-top可单独再设置上边框。 4、设置选中标签后li的变化#tab ul li.on{}记住:必须要指明id选择器下ul下的li.on 若直接建立类选择器.on{}没有效果。这样选中标签后对应的li边框就会发生变化,下边框设置为白色(为了更美观)覆盖原来的边框。 5、获取ID对象后,可在该对象下再获取标签对象如: var tabs = document.getElementById("tab");此时不需要.childNodes var divs = tabs.getElementsByTagName("div");divs为数组。 6、利用for循环为每一个li的onclick赋与一个函数()。函数()中再利用for循环为每一个div内容加上隐藏,为每一个li移除类选择器,除了所选中的li和对应的div(利用this)。注意:第一个for循环的i到了赋予的函数()中是不相通的,所以需用在第一个for中利用bq[i].index = i;传递i的值到li的index属性中。 7、第一个li默认class为on,第一个div内容默认无class,其余两个div默认hide 8、还有第二种方法见方法2。 9、this一般指向调用该函数的对象。
    查看全部
    0 采集 收起 来源:编程挑战

    2018-03-22

  • 多种选择(Switch语句) 当有很多种选项的时候,switch比if else使用更方便。 语法: switch(表达式) { case值1: 执行代码块 1 break; case值2: 执行代码块 2 break; ... case值n: 执行代码块 n break; default: 与 case值1 、 case值2...case值n 不同时执行的代码 } 语法说明: Switch必须赋初始值,值与每个case值匹配。满足执行该 case 后的所有语句,并用break语句来阻止运行下一个case。如所有case值都不匹配,执行default后的语句。
    查看全部
  • 主要:变量值=true 与 变量值==true 是不同的。 前者是将true的值赋予给变量值,后者才是判断变量值与true的关系。
    查看全部
  • function compare(a,b){ return a>b?a:b; }
    查看全部
    0 采集 收起 来源:编程练习

    2018-03-22

  • 二维数组 一维数组,我们看成一组盒子,每个盒子只能放一个内容。 一维数组的表示: myarray[ ] 二维数组,我们看成一组盒子,不过每个盒子里还可以放多个盒子。 二维数组的表示: myarray[ ][ ] 注意: 二维数组的两个维度的索引值也是从0开始,两个维度的最后一个索引值为长度-1。 1. 二维数组的定义方法一 var myarr=new Array(); //先声明一维 for(var i=0;i<2;i++){ //一维长度为2 myarr[i]=new Array(); //再声明二维 for(var j=0;j<3;j++){ //二维长度为3 myarr[i][j]=i+j; // 赋值,每个数组元素的值为i+j } }
    查看全部
    0 采集 收起 来源:二维数组

    2018-03-22

  • 没有删除空白部分的时候p元素是第二个子节点,删了就是显示p,没删的话第一个子节点是文本节点,所以输出nodeName的时候是#text。
    查看全部
  • for循环中,不能加int ,直接i=0就行了,getElementsByTagName();记得加S。
    查看全部
  • scrollLeft:设置或获取位于给定对象左边界与窗口中目前可见内容的最左端之间的距离 ,即左边灰色的内容。 scrollTop:设置或获取位于对象最顶端与窗口中可见内容的最顶端之间的距离 ,即上边灰色的内容。 offsetLeft:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 。 offsetTop:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置 。 offsetLeft和offsetTop 属性可以返回当前元素距离某个父辈元素左边缘的距离,当然这个父辈元素也是有讲究的。 (1).如果父辈元素中有定位的元素,那么就返回距离当前元素最近的定位元素边缘的距离。 (2).如果父辈元素中没有定位元素,那么就返回相对于body左边缘距离。
    查看全部
  • function bigger(x,y){ if(x>y){ return x; } else if(x==y){ return "一样大"; } else{ return y; } }
    查看全部
    1 采集 收起 来源:编程练习

    2018-03-22

  • <div> javascript <p>javascript</p> <div>jQuery</div> <h5>PHP</h5> </div> <script type="text/javascript"> var x= document.getElementsByTagName("div")[0].childNodes; for(var i=0, i<x.length,i++){ document.write("第"+(i+1)+"个节点的值是:"+x[i].nodeValue+"<br />"); document.write("第"+(i+1)+"个节点的名称是:"+x[i].nodeName+"<br />"); document.write("第"+(i+1)+"个节点的属性是:"+x[i].nodeType+"<br />"); document.write("<br />"); }
    查看全部

举报

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

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