《Javascript DOM编程艺术》学习笔记 第1-6章

第1章 Javascript简史

Javascript是Netspace公司与Sun公司合作开发的，Javascript 1.0版于1995年推出。

为与微软公司竞争，Netspace公司和Sun公司联合ECMA制定了Javascript标准，因此Javascript有另一个名字：ECMAScript。

DOM是一套对文档内容进行抽象和概念化的方法。个人理解，就是浏览器把每一个加载的网页视作一个实例化的DOM类型对象，DOM相当于C++/Java中的class类，该class有一些数据成员/字段和成员函数/方法，我们可以通过成员函数/方法来访问和操作这个实例化的DOM对象。

浏览器开发商（Netspace、微软等）在1998年与W3C完成了第一版的DOM通用标准制定（大致可以视作大家统一了成员函数/方法API接口）。

第2章 Javascript语法

Javascript代码通过放在HTML的script标签中来引用，一种是直接内嵌，如下：

            <
            script
            >
            
your javascript code

            </
            script
            >
        

另外一种是分离风格，如下：

            <
            script 
            src
            ="script_file.js"
            ></
            script
            >
        

Javascript脚本运行不需要在浏览器和操作系统里面安装任何软件或插件。浏览器能够直接识别并解析Javascript脚本，因为现代浏览器都内置有解释引擎（不支持Javascript的浏览器赶紧卸载了）

Javascript语法风格和C系很接近。分号分割语句（可省略），花括号表示语句块。使用和C/C++/Java相同风格的单号注释（//）和多行注释（/* */）

变量声明和上述静态类型语言不同，不需要指定类型，同一变量可以接受不同类型的值。

虽然Javascript声明变量不需要明确指定类型，但是不代表Javascript没有数据类型，其还是存在基本类型。如数值类型、字符串类型、布尔类型。

Javascript中也有数组和对象。

Javascript还有很多的操作符：算术操作符（+, - , *, /, ++, --）、位运算符、赋值运算符、比较运算符、逻辑运算符等。

Javascript也提供条件语句（if）、循环语句（for、while、do while）。

运算符和功能语句基本同C系语言。

Javascript函数的定义使用关键词 function，并且不需要声明返回值（因为Javascript不需要说明变量的类型）。同样地，参数只需参数名，无需参数类型。

Javascript中的变量一样存在作用域，分为全局作用域和局部作用域。

Javascript中的对象也是有数据成员和成员函数的，它们在Javascript中的术语称呼为属性（property）和方法（method）。Javascript的对象通过new关键字来实例化得到。

第3章 DOM

D：表示document，就是表示浏览器加载的那个HTML页面。

O：表示object，就是HTML页面中一个个对象。

M：表示model，我的理解是结构和关系，也即各个对象间如何组织构成。

节点

浏览器加载得到的HTML页面可以视作一棵树，下面是我从 https://segmentfault.com/a/1190000010721007 抄过来的一个说明图：

从上面的图可以看出，一个HTML树有3种类型节点，一种是元素（标签）节点，一种是属性节点，还有一种是一些文本内容，这种是文本节点。但是根据最新的W3C标准，属性已经不再算是节点。

关于文本节点的演示如下：

            1
            <
            p
            >
            2
            this is a paragraph

            3
            <
            span
            > some text </span>4<p>

上述代码段中第2行是一个文本节点，它在p元素节点下面，但是第3行中的文本并不是p元素节点的文本节点，因为它被包含在span标签中，它是span标签的文本节点。

获取元素

在DOM中有3种方法可以获取元素，第一种是通过元素的 id 属性标记，第二种是通过 class 属性标记，第三种则是通过标签的名字。

id 属性获取：getElementById(id)　　id唯一，因此返回值唯一

class 属性获取：getElementsByClassName(class)　　class可重复使用，返回值是数组

标签名获取：getElementsByTagName(tag)　　标签可重复使用，返回值是数组

获取和设置属性（仅支持元素节点，只有元素节点有属性）

属性获取：getAttribue(dst_attr)

属性设置：setAttribue(dst_attr)

原文：https://www.cnblogs.com/pluse/p/12377816.html