zoukankan      html  css  js  c++  java
  • [妙味JS基础]第二课:for应用、this关键字

    知识点总结

    • getElementsByTagName(动态方法) 与 getElementById(静态方法) 的区别
      1、ID前面只能跟document,不能跟其他元素,比如:document.getElementById('list')
          TagName前面可以跟其他元素也可以跟document,比如:oUl.getElementsByTagName('li')
        2、ID只能找到一个元素
           TagName找到一堆元素的集合,因此在用的时候必须要加上:[]
        3、ID如果不存在,用getElementById查找,就找不到
           TagName如果不存在,在后面动态添加了,再用getElementsByTagName查找,这时就可以找到。
    • document.body、document.title
      document.title = 123;
        document.body.innerHTML = 'abc';
    • for循环
    例子一:
        for (var i=0;i<aLi.length;i++) {}
    
        每执行一次for循环,需要去计算一下aLi.length,因此出于性能方面的考虑,将代码更改成如下:
        var len = aLi.length
        for (var i=0;i<len;i++) {}
    
        例子二:
        为body添加3000个按钮
        for (var i=0;i<3000;i++) {
            document.body.innerHTML += '<input type="button" value="按钮" />'
        }
    
        每执行一次,需要去计算document.body.innerHTML的内容,找到后往里添加一个按钮,
        出于性能方面的考虑,先用一字符串存起来,最后再添加到document.body.innerHTML中,修改如下:
    
        var str = '';
        for (var i=0;i<3000;i++) {
            str += '<input type="button" value="按钮" />'
        }
    
        document.body.innerHTML = str;
    
        例子三:
        for(var i=0;i<100;i++) {}
        for(var i=0;i<200;i++) {}
        并列的话,var变量赋值可以是同名
    
        for(var i=0;i<10;i++) {
            for (var j=0;j<10;j++) {}
        }
        嵌套的话,var变量赋值不能相同
    • cssText 行间样式
       oDiv.style.width = '200px';
        oDiv.style.height = '200px';
    
        oDiv.style.cssText ='200px;height:200px;'
    
        都是表示行间的样式,cssText是覆盖原先的行间样式。
    • this:指的是调用当前方法(函数)的那个对象
      1、alert(this) = window.alert(this)    this=>window
        2、function(){} = window.function() {}
        3function fn1() {
                this
            }
            fn1();      this=>window
        4、
           oDiv.onclick = fn1;    this=>oDiv
        5、
           oDiv.onclick = function() {
                this          this=>oDiv
            }
        6、 oDiv.onclick = function() {
            fn1();        fn1()里的this=>window
            }
        7、<div onclick=' this '></div>   this=>div
        8、<div onclick=' fn1() '></div>   fn1()里的this=>window
    
        总结:
            1、直接调用函数,比如:fn1() ,this=>window
            2、谁调用this就是指谁
  • 相关阅读:
    python发送邮件
    nginx的信号量和平滑升级
    CentOS6下nginx的源码安装
    mysql备份与还原之mysqldump
    myslq基本语法(3)
    mysql基本语法(2)
    MySQL中数据表和数据的操作
    mysql概述及基本语法(1)
    shell的随机数
    浏览器的跨域问题的解决办法
  • 原文地址:https://www.cnblogs.com/joya0411/p/3580896.html
Copyright © 2011-2022 走看看