知识点总结

  • 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 ='width:200px;height:200px;' 都是表示行间的样式,cssText是覆盖原先的行间样式。
  • this:指的是调用当前方法(函数)的那个对象
  1、alert(this) = window.alert(this)    this=>window
2、function(){} = window.function() {}
3、
function 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就是指谁

[妙味JS基础]第二课:for应用、this关键字的更多相关文章

  1. [妙味JS基础]第一课:属性操作、图片切换、短信发送模拟

    知识点总结 HTML的属性操作:读.写 元素.属性名 => “读” 元素.属性名=新的值 => “写” 例如: oBtn.value => “读” oBtn.value='按钮' = ...

  2. [妙味JS基础]第九课:定时器管理、函数封装

    知识点总结 函数封装 回调函数 实例:抖动函数 获取当前的位置 通过数组来实现,一正一负,直到恢复成0为止. 当前位置与数组中各值相加

  3. [妙味JS基础]第六课:作用域、JS预解析机制

    知识点总结 浏览器的解析方法 script 全局变量,全局函数 自上而下 函数 由里到外 "JS的解析器": 1)“找一些东西”:var function 参数 var a=未定义 ...

  4. [妙味JS基础]第四课:JS数据类型、类型转换

    知识点总结 JS数据类型:number数字(NaN).string字符串.boolean布尔值.函数类型.object对象(obj.[].{}.null).undefined未定义 typeof 用来 ...

  5. [妙味JS基础]第十二课:数组随机、数组去重

    知识点总结 json var json={'name':'abc'} 属性加分号为安全的写法 json: 只能用for in 数组:for和for in 都可以使用 json没有length和下标 数 ...

  6. [妙味JS基础]第十一课:字符串、查找高亮显示

    知识点总结 字符串方法 var str = '2014年新春快乐哈' * length 字符串长度 str.length =>10 ------------------------------- ...

  7. [妙味JS基础]第十课:日期对象、时钟倒计时

    知识点总结 时间.年.月.日.时.分.秒 new Date() ->当前系统的时间对象 数字类型: getFullYear().getYear().getUTCFullYear() getYea ...

  8. [妙味JS基础]第八课:return、定时器基础

    知识点总结 return 1)函数名+括号 = return 返回值 2)所有的函数默认的返回值 = 未定义 3)return后面的代码不执行 arguments  =>为实参的集合,当参数个数 ...

  9. [妙味JS基础]第七课:运算符、流程控制

    知识点总结 &&(与).||(或).!(非) 与: alert(20 && 20>100) => false alert(20 && 20& ...

随机推荐

  1. Raspberry Pi(树莓派)上从零开始构建Linux系统(简称PiLFS)(一)

    一. 准备工作 1. 装有Linux宿主系统的树莓派主板,可参考 Raspberry Pi(树莓派)上安装Raspbian(无路由器,无显示器) 2. 参考网址:Linux From Scratch ...

  2. CreateMutex 创建一个有名字的互斥量的时候hMutex=CreateMutex(NULL,TRUE,"tickets")报错

    编译器报错: 不能将参数 3 从“const char [8]”转换为“LPCWSTR”,怎么改成LPCWSTR类型 更改方法: hMutex=CreateMutex(NULL,TRUE,L" ...

  3. 安卓自动化测试工具一:Monkey

    一:monkey的用途:主要用于稳定性测试,模拟用户操作 二.monkey的基本使用 monkey文档地址:"<android_sdk>/docs/tools/help/monk ...

  4. Time.timeScale、游戏暂停

    原文链接 项目里面一直在用Time.timeScale来做游戏的 1倍 2倍整体加速,今天我仔细看了一下Time.timeScale才发现之前我理解错了一些东西. Time.timeScale可以控制 ...

  5. 傲梅分区助手专业版 v6.2 中文免费版

    软件名称: 傲梅分区助手专业版 软件语言: 简体中文 授权方式: 免费软件 运行环境: Win7 / Vista / Win2003 / WinXP / Win2008 软件大小: 9.1MB 图片预 ...

  6. HDU 5880 Family View

    $AC$自动机. 用$AC$自动机匹配一次,开一个$flag$记录一下以$i$位置为结尾的最长要打$*$多少个字符,然后倒着扫描一次就可以输出了. #pragma comment(linker, &q ...

  7. hdu1031

    #include <cstdio> #include <cstdlib> struct element{ int id; double sa; }e[10000]; int c ...

  8. CentOS python升级到3.5时yum报错

    File except KeyboardInterrupt, e: ^ SyntaxError: invalid syntax 解决步骤: #vi /usr/bin/yum 将#!/usr/bin/p ...

  9. struts2查询的数据的存放

    当我们查询数据的时候,把它存放到一个位置.以供页面显示. 1:使用***Map取代内置对象存放 public String query(){ ActionContext.getContext().pu ...

  10. [linux]查看机器有几个cpu,是否支持64位

    1. 查看物理CPU的个数#cat /proc/cpuinfo |grep "physical id"|sort |uniq|wc -l 2. 查看逻辑CPU的个数#cat /pr ...