JavaScript DOM编程艺术（第2版）第二章 语法 第三章DOM

第二章 语法

一.变量

把值存在变量的操作——赋值
JavaScript可以直接对变量赋值而不需事先声明。
如果在对某个变量赋值前没有声明，赋值操作会自动声明该变量。var age;
JavaScript中变量不能包含空格或标点符号
变量可以使用驼峰命名

二.数据类型

1.必须明确类型声明的语言——强类型
js中不用进行类型声明——弱类型
2.字符串var mod= ‘happy’; var mod = “happy”;
数字：不用限制他必须为一个整数，js中允许使用带小数点的数值
var age=98.55
也支持负数 var age =-5.333
3.布尔值Boolean只有两个可选项true和false
4.数组：用一个变量表示一个值的集合，集合中的每个值都是这个数组的一个元素。
数组的长度length
var Beatles= Array（4）从0开始计数，长度为4，是从0-3
数组元素可以是字符串，布尔值，数字，可以混合组成。数组中还可以包含数组。
关联数组“可以使用字符串来代替数字值，代码可读性提高”

<script>
    var lon = Array();
    lon["name"]="John";
    lon["year"]=1940;
    lon["living"]=false;
</script>

5.对象
对象的每个值都是对象的一个属性。

//写法一
<script>
    var lon = Object();
    lon.name = "John";
    lon.year = 1940;
    lon.living = false;
</script>

//写法二（多用）
<script>
    var lon ={
        name:"John",
        year:1940,
        living;false
    }
</script>

三.操作

1.算术操作符

+  -  * /

字符串拼接：var mes = "I am "+“happy”

四.条件语句

1.比较操作符

> >= == === < <=

2.逻辑操作符

逻辑与&&
逻辑或||
逻辑非！

五.循环语句

1.while
2. do while
3. for

六.函数

<script>
    function multiply(num1,num2) {
        var total=num1*num2;
        alert(total);
    }
    multiply(2,3);
</script>

1.全局变量和局部变量
2.作用域
3.函数中使用var为函数设定关键字，函数中使用var则为局部变量。

<script>
    function square(num) {
        sum = num*num;
        return sum;
    }
    var sum = 50;
    var number = square(20);
    alert(sum);//400
</script>

七.对象

1.包含在对象中的数据可以通过属性和方法来访问
属性：是属于某个特定对象的变量
方法：只有某个特定对象才能调用函数
对象就是由一些属性和方法组合在一起二构成的一个数据实体
2.内建对象

<script>
    var bea = new Array();
    len = bea.length;
    
    var num=7.569;
    var num=Math.round(num);
    alert(num);//8

    var current_date = new Date();
    var today = current_date.getDay();
    alert(today);//6——星期六
</script>

3.宿主对象
包括：Form，Image，Element。可以通过这些对象获得关于网页上表单 图像和各种表单元素等信息

---

第三章DOM

一.概念

1.文档：DOM中D：document
2.对象：DOM中O:object
JavaScript中对象分为3类：
用户定义对象，内建对象（Array，Math，Date），宿主对象：浏览器提供的对象
3.模型：DOM中M：model

二.节点

1.节点：表示网络中一个连接点。
2.元素节点：DOM的原子就是元素节点。使用HTML的标记
3.文本节点：元素节点是节点类型的一种。

<p>123456</p>//p标签内包含文本，这就是一个文本节点

4.属性节点：用来对元素做出更具体的描述
下面title就是一个属性节点：还有id

<p title="a gentle reminder">123456</p>

5.获取元素：——3个DOM方法可获取元素节点
getElementById
getElementByTagName——方法返回一个对象数组，每个对象分别对应文档有着给定标签的一个元素。该方法只有一个参数的函数。（“li”）
getEByClassName——方法返回一个对象数组

三.获取和设置属性

1.getAttribute：查询的属性的名字——只能用于元素节点

获得p元素的title属性
		var pa = document.getElementsByTagName("p");
        for (var i=0;i<pa.length;i++){
            alert(pa[i].getAttribute("title"));
        }

2.setAttribute：对属性节点的值做出修改——只能用于元素节点

 var sh = document.getElementById("pur");
 sh.setAttribute("title","a list of goods");

 var pa = document.getElementsByTagName("p");
 for (var i=0;i<pa.length;i++){
 var title_text = pa[i].getAttribute("title");
   if (title_text){
        pa[i].setAttribute("tittle","brand new title text");
        alert(pa[i].getAttribute("title"));
      }
}