JavaScript
- 对于编程语言的认识
一门成熟的编程语言应该具备:变量、数据类型、运算符、控制语句(顺序结构、选择判断结构、循环结构)、自成体系的API - JavaScript的作用
- 对DOM进行操作(DOM:Document Object Model):通过事件驱动页面模型发生变化(DOM树中元素的增删改查,特别是改:改内容,改样式),JavaScript能操作DOM的原因在于JavaScript实现了DOM相关操作的接口,能满足对DOM的操作。
- 业务逻辑的处理
需要掌握的内容
JavaScript是个弱语言,而且书写非常的随意。
- 弱语言体现在变量是没有准确的数据类型定义的。通过var命令定义。
1
var flag = 'abc';
2
flag = 12;
3
flag = true;
4
flag = {name:'Tom'};
5
flag = function() {
6
alert("Hello,JavaScript");
7
};
- 关于JavaScript的判断条件
- 在条件表达式中,数字0和非0也可以表现为false和true。在条件表达式中,数字0和非0也可以表现为false和true。
- 只需要运用if-else结构即可。
- 三运运算符是需要熟练掌握的,其本质是个表达式
- 表达式是有返回值(结果)的
数据类型
数据类型其本质就是在内存中存储的结构是不一样的,在使用者开来,对于不同的业务需求,可以选用不同的数据类型定义变量。
- 数值型(精度问题的要注意,比如执行 0.3 + 0.2)
- 字符型(拼接使用+)
- 布尔类型:0和非0也能表现假和真
- 对象类型:要充分理解下面一段代码的意思
- 函数类型
1
var obj = {
2
name : "Tom",
3
age : 12,
4
eat : function () {
5
console.log("eat");
6
}
7
}
8
9
var tt = function(){}
10
11
var Login = function() {
12
13
var tableInit = function(){console.log("tableInit")};
14
15
return {
16
init : function() {
17
tableInit();
18
}
19
};
20
}();
21
22
Login.init();
- DOM操作
- 通过选择器定位元素(知道有相关的方法找到元素)
- 对选择的元素进行处理
大部分的DOM处理时围绕以下三种节点类型操作的
1
Element:网页的各种HTML标签(比如:<body> <h> <a> <div>)
2
Attribute:网页元素的属性(比如:id=”id” class=”class” type=”text”)
3
Text:标签之间或标签包含的文本
- DOM的遍历
在DOM元素上定义ID属性,通过ID选择器查找(虽然在网页中允许重复ID的出现,但是要避免这种现象的出现)
ID在定义的时候尽量要起的稍微复杂一些,满足一个标准的规范定义。
在一个元素范围内查找元素,使用jQuery的find方法
1
<form id="form1">
2
<input type="text" name="username"/>
3
</form>
4
5
<form id="form2">
6
<input type="text" name="username"/>
7
</form>
8
<input type="button" value="click" onclick="show();"/>
9
10
function show() {
11
var u1 = $("#form1").find("input[name='username']");
12
var u2 = $("#form2").find("input[name='username']");
13
alert(u1.val());
14
alert(u2.val());
15
}
通过Class定位元素,
- DOM增加操作
添加一个Element节点
设置一个节点的样式属性 - DOM删除操作
删除一个Element节点
通过获取到父节点,删除其子节点
JavaScript中方法的调用是不受方法定义中参数的约束的。