avaScript简介
JavaScript一种直译式脚本言语，是一种动态类型、弱类型、依据原型的言语，内置支撑类型。它的说明器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本言语，最早是在HTML(标准通用符号言语下的一个运用)网页上运用，用来给HTML网页添加动态功用。
在1995年时，由Netscape公司的Brendan Eich，在网景导航者浏览器上初次规划结束而成。因为Netscape与Sun协作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为靠近。
为了获得技术优势，微软推出了JScript，CEnvi推出ScriptEase，与JavaScript相同可在浏览器上运行。为了共同标准，因为JavaScript兼容于ECMA标准，因此也称为ECMAScript。
一、查找HTML元素
一般，通过 JavaScript，您需求操作 HTML 元素。
1、通过 id 找到 HTML 元素
2、通过标签名找到 HTML 元素
3、通过类名找到 HTML 元素
提示：通过类名查找 HTML 元素在 IE 5,6,7,8 中无效。
var x=document.getElementById("intro");
var y=document.getElementsByTagName("p");
①、改动 HTML 元素的内容 (innerHTML)
document.getElementById(id).innerHTML=new HTML
②、改动 HTML 特色
document.getElementById(id).attribute=new value
document.getElementById("image").src="landscape.jpg";
③、改动 HTML 样式
document.getElementById(id).style.property=new style
④、添加或删去 HTML 元素
A、添加
B、删去
var child=document.getElementById("p1");
parent.removeChild(child);
二、DOM 工作
1、Js中的工作
行为,结构,样式别离的页面
一般工作 onclick 鼠标点击时触发此工作
ondblclick 鼠标双击时触发此工作
onmousedown 按下鼠标时触发此工作
onmouseup 鼠标按下后松开鼠标时触发此工作
onmouseover 当鼠标移动到某方针规划的上方时触发此工作
onmousemove 鼠标移动时触发此工作
onmouseout 当鼠标脱离某方针规划时触发此工作
onkeypress 当键盘上的某个键被按下而且开释时触发此工作.
onkeydown 当键盘上某个按键被按下时触发此工作
onkeyup 当键盘上某个按键被按铺开时触发此工作
①、绑定工作的3种方法
1: 直接写在html标签内声明
这种写法最陈腐,兼容性最强.归于DOM的lev0级的标准.这个作用,等同于在点击div的时分,实行"t();"这一语句,
在全局规划内实行,因此,t函数内部的this指代全局方针-->window 想操作被点击的DOM方针,用this就不行了.
第2种绑定方法:
DOM方针.onclick = function () {}
这种绑定是把一个DOM方针onclick特色赋值为一个函数,
因此,函数内部的this直接指向该DOM方针.
在这种绑定方法中,只能给一个工作,绑定一个处理函数
即 .onclick = fn1; .onclick = fn2;
终究的作用, 是.onclick = fn2;
假设用函数来调用其他函数的方法
例.onclick = function () {fn1(),fn2()}
那么此时， fn1,fn2中的this又指向window.
怎样绑定多个函数，并令this指向DOM方针
第三种绑定工作的方法:
DOM lev3的工作绑定标准
添加和去除监听工作.
addEventListener('工作',函数); // 第一个参数工作参数, 没有前缀"on", w3c的标准,IE不支撑
留心点1: 假设添加了多个工作处理函数, 按"添加时的先后次第来实行"
留心点2: 工作处理函数中的this 指代 DOM节点本身 (w3c标准)
留心点3: 第一个工作参数,一概把工作称号的'on'去掉 (w3c标准)
去除绑定
removeEventListener('工作',函数)
IE下绑定工作与革除工作的方法
attachEvent('工作',函数) // 留心: 工作 要加on
detachEvent('工作',函数) // 工作依然要加on
总结一下:
W3c addEventListener 与IE的attachEvent()的不同
1: 函数名不同
2: 工作名不同, IE下要加on,w3c不加on
3: 加工作后的实行次第不同, w3c按绑定工作的次第来实行, 而IE6,7,8,是后绑定的工作先发生.
4: this的指向, w3c中,绑定函数中的this指向 DOM方针, 而IE6,7,8中,指向window方针
三、工作的捕捉与冒泡模型
在w3c的模型中,
addEventListener 支撑 第3个参数来声明工作的模型为冒泡仍是捕捉.
假设声明为 true,则为捕捉方法
假设声明为false, 或许不声明, 则为冒泡方法
留心: IE的attchEvent 没有第3个参数,不支撑捕捉模型
工作方针的概念:
当工作对应的函数被触发时, 函数会接收到一个工作参数, // w3c标准
例 xx.onclick = function (ev) {alert(ev)}
点击后,ev 参数就代表单击那一瞬间的"各个参数",以一个方针的方法传过去.
关于IE, 当工作发生的瞬间,工作方针赋值给window.event特色
四、工作的间断
怎样间断工作的传达
在w3c: 工作.stopPropagation();
在IE中, 工作方针.cancelBubble = true;
cancelBubble = true //IE吊销冒泡
stopPropagation(); // w3c吊销冒泡
returnValue = false; // IE吊销工作作用
preventDefautl() ;// w3c吊销工作作用
吊销工作的默许作用
工作方针.preventDefault(); // 阻止工作的默许作用, w3c方法
工作方针.returnValue = false; // 设置returnValue 的特色值为false;
五、Js 作用域链(是指AO链)
1:参数
2:部分变量声明
3:函数声明
* 函数声明与函数表达式的差异
表达式必有返回值,把返回值(即匿名函数)赋给了一个变量.
此时 就是一般的赋值过程.
①、js并不是一句一句次第实行的,先进行词法分析
This, 与 arguments
当一个函数运行的时分,函数内部能引证的变量有这么几种
AO、arguments、this
关于 arguments和this, 每个函数都有自己独有的arguments和this, 且不进行链式查找
arguments是什么?
答:
1:arguments是收到的实参副本
2:收到实参收集起来,放到一个arguments方针里
在词法分析中, 首先按形参构成AO的特色,值为undefined
当实参传来时, 再修正AO的相应特色.
t(a,b,c){},
调用时: t(1,2,3,4,5) 个参数
此时 , AO特色只需a,bc,3个特色, arguments里有1,3,3,4,5, 一切的值
关于超出形参个数之外的实参, 可以通过arguments来获得
3:arguments 的索引 从 0, 1,2,....递加,与实参逐个对应
4:arguments.length 特色代表实参的个数
5:Arguments必定不是数组, 是长的比较像数组的一个方针,虽然也有length特色
6:Arguments每个函数都会有,因此,arguemnts只会在内部找本身的arguments,
无法引证到外层的arguments
This是谁
This是指调用上下文
针对函数的运用场景来谈论
函数的4种调用方法
1:函数方法
直接调用函数名,或函数表达式的返回值,
This指代全局方针,window
2:特色方法(方针方法方法)
This指代该方针(方法的属主)
3:结构器方法
通过 new 函数 名() , 来创建方针
在js里, 结构函数与方针的联络比较懈怠,
方针就是"特色->值"的集结
结构器的作用,是制作一个方针,把this指向该方针,
4:call,apply方法
函数本身就是方针,方针就有方法
函数名.call(方针,参数1,参数2,参数3);
以fn.call(obj,'a','b');
实际作用相当于
1:fn内部的this指向了obj
2:fn('a','b');
Apply的作用与call相同, 只不过传参时,把一切参数包装在数组里,传过去.
例 fn.call(obj,'a',' b') ===> fn.apply(obj,['a','b']);
还有一种改动this的方法
With 语句
With(方针) {
语句1
语句2
.....
}
在with内部的语句,就把参数中的方针当成的上下文环境.
六、词法分析
js实行次第
1:词法分析阶段
先把接收到的参数放到激活方针上，再对函数体中代码作分析。
a: var xx = yy;
做法:声明一个xx特色在激活方针上,
但不赋值,假设已经有xx,则不无动作.
b:function ttt() {
}
做法:直接声明ttt特色，且内容是函数体。
2:实行语句阶段
六、Js面向方针
特色,方法-->方针
"类"能做到封装,继承,多态,
"类"的静态方法
1: js中的方针是什么?
答:js的方针就是键值对的无序集结
2:种创建方针的方法
①、通过字面量来创建方针
例:{age:22,hei:180}
{}->空方针,没有特色
②、通过 new Object([value]);
通过结构函数来创建方针(和第2种没差异,因为Object就是系统内建的结构函数)
七、Js面向方针中的封装
javascript言语中,没有现成的私有特色/方法机制,但可以通过作用域来仿照私有特色,私有方法。
方针的特色外界是可读可写的, 怎样来抵达封装的目的?
答:通过闭包+部分变量来结束
在结构函数内部声明部分变量, 和一般方法,
因为作用域的联络,只需结构函数内的方法,才干访问到部分变量.
而方法关于外界是敞开的,因此可以通过方法来访问部分变量.
在查找特色或方法的过程中, 沿着原型链来查找特色,
方针->原型->原型的原型....->空方针-->NULL
原型构成一条链
这个查找特色的方法,称为js的原型链
①、原型假充的方法来结束继承
仿制继承, 又称方针继承,其实就是仿制父方针的特色到子方针身上
八、Js面向方针中的静态特色或许静态方法
从豆浆机-->制作豆浆的流程看, 豆浆机充当的是结构函数的人物.
假设单独看豆浆机本身, 豆浆机也是一部机器,也是一个方针,也可以有特色和方法.
那么,豆浆机作为方针时的特色和方法,就相当于类的静态特色,静态方法.
十、闭包
一句话说闭包:
函数的作用域,不取决于运行时的环境,
而取决于函数声明时的环境.
典型运用:
闭包与部分作用域仿照私有特色
闭包与匿名函数结束"不受搅扰的变量"
①、闭包(4) 闭包+匿名函数
