JavaScript DOM 脚本编程艺术

第一章javascript简史

1.javascript的起源

“web标准”

2.浏览器之争

“DHTML”

3.制定标准

标准化DOM可以让任何一种程序设计语言对使用任何一种标记语言编写出来的任何一份文档进行操控

DOM是一种API(一组已经得到有关各方共同认可的基本约定)

第二章javascript语法

1.准备工作

解释性程序设计语言，编译性程序设计语言（java）

2.语法

语句结构方面的各项规则

3.语句

指令

注释：///**/

4.变量

javascript允许不声明就对变量复制，但最好先声明

数据类型：字符串（引号，转义字符），数值，布尔值

数组（声明：var first=Array(n),填充：var first=Array(1,2,3,4)；var first=[1,2,3,4];）

数值数组（关联数组的特例，关联的，名称是0-n的数字）

关联数组

5.操作

算术操作符

6.条件语句

if…else

比较操作符

逻辑操作符

7.循环语句

while

do…while

for first.length数组长度

8.函数

内建函数

定义：形参

调用：实参，返回值，复制给变量

变量的作用域：全局，局部

9.对象

内建对象

宿主对象，document对象

对象是统称，实例是个体

var kitty=new Person;

第三章DOM

1.文档：DOM中的D

当创建了一个网页并把它加载到web浏览器中时，DOM就在幕后悄然而生，他将根据你编写的网页文档创建一个文档对象

2.对象：DOM中的O

3.模型：DOM中的M

DOM代表着被加载到浏览器窗口里的当前网页，浏览器向我们提供了当前网页的模型，我们可以通过javascript去读取这张地图

DOM把文档表示为一颗“节点”树

节点：元素，文本，属性

getElementById()返回一个对象，typeof（）

getElementByTagName()返回一个对象数组，typeof（）

4.趁热打铁

getAttribute()

setAttribute()

第五章javascript编程原则和良好习惯

1.不要误解javascript

为这个网页增加这种额外的行为是否确有必要？

2.预留退路

虽然某些功能无法使用，但基本的操作仍能顺利完成；

浏览器不支持javascript，或者用户禁止了javascript

“javascript：”伪协议和“#”，不建议使用

3.向css学习

循序渐进：用一些额外的信息层去包裹原始数据的做法；

4.分离javascript

window.onload=prepareLinks;

function prepareLinks(){

    var links=document.getEletmentByTagName(“a”);

     for(var i=0;i

          if(links[i].className==”popup”){

                 links[i].onclick=function(){

                       popup(this.getAttribute(“href”));

                        return false;

                  }

           }

    }

}

5.向后兼容性

对象检测：if(!document.getElementByTagName) return false;

core DOM和HTML-DOM

第七章动态创建HTML内容

1.document.write（）方法

避免使用此方法

2.innerHTML属性

3.DOM提供的方法

var para=document.createElement(“p”);

vartestdiv=document.getElementById(“testdiv”);

testdiv.appendChild(para);

第八章充实文档的内容

1.不应该做的事情

2.把“不可见”变成可见

3.原始内容

4.Xhtml文档

5.CSS

6.javascript代码

用javascript函数先把文档结构里的一些现有信息提取出来，再把那些信息以一种清晰和有意义的方式重新插入到文档里去

第九章CSS-DOM

1.三位一体的网页

2.style属性

只能返回那些内嵌在HTML内容里的样式信息

Camel记号，不用连字符

3.何时该用DOM脚本去设置样式

4.className属性

通过javascript刷新元素的class属性；ok