JS知识点郁冬

1、JS与DOM的关系（特效就是JS对DOM对象操作的结果）

浏览器有渲染HTML代码的功能，把html源码在内存中形成一个DOM对象

浏览器内部有一个JS解释器，如chrome用V8引擎

我们在html里写一个JS代码，代码被引擎所执行，而执行的结果就是对DOM的操作

而对DOM操作的结果，就是我们常看到的特效，如轮播、文字变色等

2、引入JS代码

a.页内JS代码

b.引入JS代码

JS的变量名可以用_,数字,字母,$,组成,且数字不能开头

变量名区分大小写

vara=20;varb=30;varjquery='juery';alert(a+b);alert(jquery);

4、变量类型

数值、字符串、数组、对象、布尔、null、undefined

//数组的写法,"[]"包围,","号隔开每一个值//JS中,数组是索引类型,key是0,1,2,3,4,5,....varh=['张','王','李','赵'];//对象(和PHP中的关联数组类似)vari={'name':'poly','age':3};alert(h[2]);//李alert(i.age);//3alert(i['age']);//3

5、运算符

%取模

+拼接

//逻辑运算符与PHP不同vara=3;varb=2;varc=a||b;//c在PHP中为true,在JS中,为a的值,3console.log(c);a=0;b=9;c=a||b;//c在PHP中为true,在JS中,为b的值,9console.log(c);//总结,逻辑运算的值,是能确定运算的结果的单元的值

6、控制结构

7、window对象

window对象包括地址栏,浏览历史,窗口的宽高等，

其中我们运用最多的就是DOM对象，即HTML代码部分

8、var

9、找对象的几种方法

按id查找——getElementsById

按class查找——getElementsByClassName

按标签查找——getElementsByTagName

按层级关系查找——parentNode/childNodes（子元素有多个的话要按数组操作）

按name查找（适用于表单）——getElementsByName

10、操作对象的属性

如果css属性带有横线,如border-top-style,则把横线去除并横线后的字母大写.

obj.style.borderTopStyle

11、测试1——改变div颜色

点击div就可以把div颜色改变

12、测试2——点亮灯泡

鼠标移动到灯泡上状态就会发生改变，

13、测试3——点击放大div