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

JavaScript进阶篇

慕课官方号 页面重构设计
难度入门
时长 8小时55分
  • return理解;

    例子1:function  a(b,c){

      add = b+c       //做的运算动作

    alert(add);         //对话框弹出结果

    }

    a(1,2)     //调用函数并且给函数a(1,2)里面传入1和2;


    例子2:function  a(b,c){

      add = b+c       //做的运算动作

    }

    alert(   a(1,2)  );       //注意了能弹出结果吗?       显然不加return。。。函数里面add结果是出不来的。。


    看清楚第一个是调用函数a(),函数的动作与结果一次性在函数里面程序跑完,第二个是调用a(1,2),并且把a(1,2)放入alert里面弹出。。然而结果并没有从函数里面return出来...所以第二个例子里面必须加上  return add


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

    2018-06-28

  • 取消计时器clearTimeout()

    setTimeout()和clearTimeout()一起使用,停止计时器。

    语法:

    clearTimeout(id_of_setTimeout)

    参数说明:
    id_of_setTimeout:由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。

    下面的例子和上节的无穷循环的例子相似。唯一不同是,现在我们添加了一个 "Stop" 按钮来停止这个计数器:

    https://img1.sycdn.imooc.com//5b346eea0001337c03660510.jpg


    查看全部
  • 计时器

    https://img1.sycdn.imooc.com//5b346bd000016dd904700505.jpg


    https://img1.sycdn.imooc.com//5b346bdd0001c98d04790357.jpg


    https://img1.sycdn.imooc.com//5b346be50001332804820459.jpg


    使用setTimeout()实现计数统计效果,并在文本框中显示数值。

    查看全部
  • 取消计时器clearInterval()

    clearInterval() 方法可取消由 setInterval() 设置的交互时间。

    语法:

    clearInterval(id_of_setInterval)

    参数说明:
    id_of_setInterval:由 setInterval() 返回的 ID 值。

    每隔 100 毫秒调用 clock() 函数,并显示时间。当点击按钮时,停止时间,代码如下:

    <!DOCTYPE HTML> 
    <html>
     <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>计时器</title> 
         <script type="text/javascript">    
             function clock(){
                var time=new Date();
                document.getElementById("clock").value = time;    
             } // 每隔100毫秒调用clock函数,并将返回值赋值给i      
             
             var i=setInterval("clock()",100); 
         </script>
     </head>
    <body>
       <form>     
           <input type="text" id="clock" size="50"  />     
           <input type="button" value="Stop" onclick="clearInterval(i)"  />   
       </form> 
    </body> 
    </html>


    查看全部
  • #是id选择器,‘.’类选择器

    display: inline-block:块级元素的显示,显示在同一行

    li:hover{cursor: pointer;}伪类选择器,选择鼠标指针浮动在其上的元素,并设置其样式


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

    2018-06-28

  •                   setAttribute( )方法

    setAttribute( )方法增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。

    语法:

    elementNode.setAttribute( name,value )

    说明:

    1. name:要设置的属性名。

    2. value:要设置的属性值。

    注意:

    1. 把指定的属性设置为指定的值。如果不存在具有制定名称的属性,该方法将创建一个新属性。

    2. 类似于getAttribute( )方法,setAttribute( )方法只能通过元素节点对象调用的函数。

    标准的元素获取方法只有以下三个:
    document.getElementById(元素的ID);
    document.getElemetsByName(元素的name);在IE下只能获取到<input />
    document.getElemetsByTagName(元素的标签名);

    比如document.body
    最好是写成document.getElementsByTagName("body")[0];

    查看全部
  • 随机数 random()

    random() 方法可返回介于 0 ~ 1(大于或等于 0 但小于 1 )之间的一个随机数。

    语法:

    Math.random();

    注意:返回一个大于或等于 0 但小于 1 的符号为正的数字值。

    获得0 ~ 10之间的随机数,代码如下:

    <script type="text/javascript">
      document.write((Math.random())*10);
    </script>


    查看全部
    0 采集 收起 来源:随机数 random()

    2018-06-28

  • 四舍五入round()

    round() 方法可把一个数字四舍五入为最接近的整数。

    语法:

    Math.round(x)

    参数说明:

    注意:

    1. 返回与 x 最接近的整数。

    2. 对于 0.5,该方法将进行上舍入。(5.5 将舍入为 6)

    3. 如果 x 与两侧整数同等接近,则结果接近 +∞方向的数字值 。(如 -5.5 将舍入为 -5; -5.52 将舍入为 -6),如下图:


    查看全部
    0 采集 收起 来源:四舍五入round()

    2018-06-28

  • var text=con[i].getAttribute("title");这里要记得con后面要加[i],先通过getElementsByTagName(“li”),获取所有元素节点即标签节点是“li”的数组集合,一共5个,把这个数组赋值给con。

    查看全部
  • 向下取整floor()

    floor() 方法可对一个数进行向下取整。

    语法:

    Math.floor(x)

    参数说明:

    注意:返回的是小于或等于x,并且与 x 最接近的整数。


    查看全部
    0 采集 收起 来源:向下取整floor()

    2018-06-28

  • 向上取整ceil()

    ceil() 方法可对一个数进行向上取整。

    语法:

    Math.ceil(x)

    参数说明:

    注意:它返回的是大于或等于x,并且与x最接近的整数。


    查看全部
    0 采集 收起 来源:向上取整ceil()

    2018-06-28

  • 1.通过ID获取标题H1

    var myH=document.getElementById("myHead");  

    2.通过name获取值为sex的元素

    var myS=document.getElementsByName("sex") ;

    3.通过标签名获取input元素

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


    查看全部
  • 返回带有指定名称的节点对象的集合

    document.getElementsByName(name);

    与getElementById() 方法不同的是,通过元素的 name 属性查询元素,而不是通过 id 属性。

    var mynode= document.getElementsByName(myt);  

    查看全部
  • 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。DOM 将HTML文档分解为文档节点、元素节点、属性节点、文本节点和注释节点的节点树。

    节点属性:

    节点.nodeName //返回内容为节点名字的字符串

    节点.nodeValue //返回节点的值

    节点.nodeType //返回一个整数,这个数值代表节点的类型

    节点.parentNode //返回父节点

    节点.childNodes //返回由子节点构成的数组

    节点.firstChild //返回第一个子节点

    节点.lastChild //返回最后一个子节点

    节点.nextSibling //返回下一个子节点

    节点.previousSibling //返回上一个子节点

    节点方法:

    document.createElement(元素节点); //创建元素节点

    document.createTextNode("文本内容");//创建包含给定文本的文本节点

    节点.appendChild(元素节点); //在最后的子节点之后添加新的子节点

    节点.insertBefore(元素节点, 子节点); //将参一元素节点插入到参二子节点的前面

    节点.removeChild(子节点); //删除一个子节点

    节点.replaceChild(子节点, 子节点); //替换子节点


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

    2018-06-28

举报

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

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