JavaScript读书笔记-语法和基本对象
2018-10-16 本文已影响0人
yellow_橙
第1章
1.1 Javascript的起源
- DOM是为文档对象模型，我们可以利用DOM去改善文档的交互性。
- Javascript 是一种脚本语言，只能通过浏览器去完成某种操作。
第2章
2.1 准备工作
- 用javascript编写的代码必须嵌在一份html/Xhtml文档中才得以执行，可以通过两个方法做到：
将JS代码插入文档<head>部分的<script>标签间:
"http://www.w3.org/tr/xhtml11.dtd>
<html>
<head>
<script type="text/javascript">
JavaScript gose here...
</script>
</head>
<body>
mark-up goes here...
</body>
</html>
将JS存入一个独立的文件文件的扩展名.js 再利用<scrtpt>标签的src属性指向该文件。
<!DOCTYPE html PUbLIC “-//W3C//DTD XHTML 1.1//EN”
"http://www.w3.org/tr/xhtml11.dtd>
<html>
<head>
<script type="text/javascript" scr="file.js">
</script>
</head>
<body>
mark-up goes here...
</body>
</html>
2.3 准备工作
- 程序员只需简单的把各条语句放在不同的行上就可以分隔他们，如下：
first statement
second statement
如果你想把多条语句放在同一行就必须使用分号来分隔：
first statement;second statement;
- 即使没有多条语句放在同一行，每行加上分号是一个良好的习惯。
- 注释使用“//”来标记。
2.4 变量（variable）
- 把会发生变化的东西叫做变量；
- 把值存入变量的操作成为赋值；
mod = “happy”；
age = 33；
- 把值赋值给变量后，我们就可以说该变量包含这个值。把变量的值显示在一个弹出窗：
alert(mood);
alert(age);
- JS允许直接对变量进行赋值而无需提前对他做出声明:
var mood;
var age;
var mood,age; //用一条语句声明多个变量
- JS语法中不允许变量的名字中包含空格或标点符号$除外；
2.4.1 数据类型
- 变量mood的值是一个字符串类型的字面量，变量age的值是一个数据类型的字面量，虽然他们是两种不同类型的数据类型，但在JS脚本中，为他们做出声明和进行赋值的语法无任何区别。有些程序设计语言要求程序员在声明变量的同时还必须明确对其数据类型做出声明，这种做法为类型声明。
- 强类型语言，弱类型语言。
-
a. 字符串
字符串由零个或多个字符构成，包含字母、数字、标点、空格，字符串必须放在引号里。（var mood = "happy"）
-
b. 数值
如果想躺某个变量包含一个数值，不用限定他必须是一个整数，JS允许使用带小数点的数值，并且允许数值任意位数，这类数值称为浮点数（var age = -33.25）
-
c. 布尔值
布尔数据只有两种取值true和false（var sleeping = true）
2.4.2 数组
- 字符串、数值、布尔值都属于离散值，如果某个变量是离散的，他在任意时刻就只能有一个值，如果想用一个变量来储存一组值，需要用数组。
- 在JS中，数组要用关机子Array来声明，在声明数组的同时，还要这个数组的元素个数也就是数组的长度做出规定。
var beatles = （）//不规定数组中元素的个数
- 向数组中添加元素的操作叫做填充，填充数组时，不仅需要给出新元素的值，还要在数组中为新元素指定存放位置，这个位置要通过下标（index）给出。数组里的每个元素都有一个相对应的下表，在语句中，下标值必须放在方括号内
array[index] = element
- 现在填充声明的数组：
beatles[0] = "John";
beatles[1] = "Paul";
beatles[2] = "George";
beatles[3] = "Ringo";
var beatles =Array["John","Paul","George", "Ringo"];
// 声明数组同时对他们进行填充，自动从0分配下标。
- 关联数组
lennon["name"] = "john";
lennon["year"] = 2018;
lennon["living"] = "true";
2.5 操作
- 算术操作
var total = (1+4)*5;
var temp_fahrenheit = 95; //对变量进行操作；
year = year + 1 // 操作符快捷方式；
- 把字符首尾连接在一起的操作叫做拼接
var mood = "happy"
var message = "I am feeling " + "happy"
####2.6 条件语句
```if (condition){
statements;
}
if (1>2){
alert("the word has gone mad!")
}else{
alert ("all is well with the word")
}
- 条件的求值结果永远是一个布尔值
2.6.1 比较符操作
var my_mood = "happy"
var your_mood = "sad"
if (my_mood == your_mood){
alert("We both same")
}
if (my_mood != your_mood){
alert("We are feeling different moods")
}
// 这是不等于操作
2.6.2 逻辑操作符
if (num>=5 && num<=10){
alert("the number is in the right range")
}
- 逻辑操作的对象都是布尔值。
- 逻辑或 操作有两个垂直线组成（丨丨）
2.7 循环语句
- while循环与If区别是，只要给定条件的求职结果是true
var count = 1
while (count <11){
alert (count);
count++
}
2.7.2 do ... while
var count = 1
do{
alert(count)
count++
}while(count <1)
2.7.3 for
for (var count = 1;count < 11;count++){
alert（count）
}
2.8 函数
function shout(){
var beatles = array("John","Paul","Geoge","ringo")
for (var count = 0;count<beatles,length;count++){
alert(beatles[count])
}
}
- 创建一个函数让他返回一个数值、字符串、数组、布尔值，需要用到return语句：
function coverToCelsius(temp){
var result = temp - 32
result = result/1.8
return result
}
变量的作用域
- 全局变量、局部变量
function square(num){
var total = num *num
return total
}
2.9 对象
- 对象里的数据可以通过属性和方法访问
在JS脚本里，属性和方法都需要使用如下所示的点语法访问
Object.property
Object.method()
- 内建对象、宿主对象。
第3章 DOM
DOM的含义：文档、对象、模型
3.3.1 节点
- 元素节点
- 文本节点
- 属性节点
- CSS叠层样式表
- class属性
- id属性
3.3.2 getElementById()方法
- 这个方法返回一个与那个有着给定id属性值的元素节点相对应的对象；
3.3.3 getElementsByTagName()方法
- 将返回一个对象数组每个对象分别对应着文档里有着给定标签的一个元素
3.4.1 getAttribute()方法
-在找到那个元素后，我们就可以利用getAttribute()方法把他的各种属性的值查询出来。
3.4.2 setAttribute()方法
- 它允许我们对属性节点的值做出修改。
