day7_js

作者: 逆流而上_2eb6 | 来源:发表于2018-11-06 20:03 被阅读0次

    在js 中函数中用var 可表示为局部变量,不用var 是全局;变量范围越小越好;在ES5.1没有常量语法,后来的有,

    延时:window.setTimeout(函数名,时间ms) 只执行一次;更灵活,可以变化时间间隔,
    计时器:window.setInterval((函数名,时间间隔ms)
    都会返回一个计时器的id

    arguments.callee
    arguments:函数中的隐含对象,一个伪数组,表示的是函数的参数。
    callee表示正在被调用的函数
    arguments.callee拿到正在被调用的函数,匿名函数中拿自己 timeId也在一直变化,要不断更新。
    window.clearInterval(timerId); 停止计时器。clearTimeout

    var timeId = window.setTimeout(function(){
                    countDown-=1;
                    if (countDown == 0){
                window.location.href = "https://www.baidu.com";}
                    else{
                        span.textContent = countDown;
                        window.setTimeout(arguments.callee,1000);
                    }
                },1000)
    

    window.location.href 拿到完整的url
    window.history.back() / forward() / go() 浏览网页的历史记录
    window.navigator 查看浏览器的一些信息
    window.screen 查看屏幕信息

    index = 0
    index +=1;
    index %=4;
    在0-3循环。

    var img = document.getElementsByTagName("img")[0];得到的是一个数组

    通过document对象获取页面元素的常用方法有5个:
    document.getElementById("……")
    document.getElementsByTagName("....") 根据标签名得到列表
    document.getElementsByClassName("....") 根据类名获取标签的列表
    document.querySelector("....")通过样式表选择器获取单个元素
    document.querySelectorAll(".....")通过样式表选择器获取元素的列表

    绑定事件:okButton.addEventListener("click",函数名或匿名函数,)
    第三个参数默认为false;表示事件冒泡,从内向外层传递
    如果是true;表示捕获,从外向内层传递
    一般用事件冒泡。
    如果想阻止事件的传播行为可以调用事件对象的stopPropagation方法

    给okButton绑定click事件的回调函数,
    回调函数:回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应。
    当你知道事件发生时要做什么,但是不知道事件什么时候发生,这种情况的处理方式都是绑定一个事件的回调函数(callback)
    可以写多个点击事件,不会被覆盖,用onclick会被覆盖
    取消绑定的事件
    okButton.removeEventListener("click",arguments.callee)
    低版本(9以前)没addEventListener;用attachEvent();

    事件回调中的第一个参数是事件对象(封装了和事件相关的信息)

    three.addEventListener("click",function(evt){
                    window.alert("I am three");
                    evt.stopPropagation()
                })
    

    易错点

    var div = document.querySelectorAll("#div1>button");
                for(var i = 0;i<10;i++){
                div[i].addEventListener("click",function(){
                    var texts = div[i].textContent;
                    window.alert("你选中了"+texts);
                })
                    
                }
    

    回调函数没有执行,当点击是i为10;所以取不到值;
    window.alert("你选中了"+evt.target.textContent);用这个就行
    var button = evt.target ||evt.srcElement 用于解决兼容性问题。
    通过事件对象的target属性可以获取事件源(谁引发了事件)
    有的浏览器要用srcElement属性获取事件源
    可以通过短路运算来解决这兼容问题

    当获取到一个元素后可以通过他的属性来获取他的父节点、子节点、
    parentNode:父元素
    firstChild/lastChild/children
    previousSibling/nextSibling :前/后一个兄弟元素

    相关文章

      网友评论

          本文标题:day7_js

          本文链接:https://www.haomeiwen.com/subject/pykpxqtx.html