JavaScript

Function：函数对象

1、创建：

2、属性：length属性代表形参个数。

document.write(fun1.length + "
");

3、特点：

①方法定义时，形参的类型不用写，返回值类型也不写。

②方法是一个对象，如果定义名称相同的方法，会覆盖。

③在JS中，方法的调用只与方法的名称有关，与参数列表无关。

④在方法声明中有一个隐藏的内置对象（数组），arguments，封装所有的实际参数。例如：求任意个数的和。

function add() {
	var sum = 0;
	for(var i = 0; i < arguments.length; i++) {
		sum += arguments[i];
	}
	return sum;
}
var sum = add(1, 2, 3, 4, 5);
document.write(sum + "
");

Array：数组对象

1、创建：

var arr1 = new Array(1, 2, 3);
var arr2 = new Array(2); // 如果只有一个数，则代表数组长度
var arr3 = new Array();
var arr4 = [1, 2, 3, 4];

2、属性：length代表数组长度。

document.write(arr5.length);

3、方法：

①join(参数)：将数组中的元素按照指定的分隔符拼接为字符串。

var arr4 = [1, 2, 3, 4];
document.write(arr4.join("++"));

结果：

②push()：向数组的末尾添加一个或更多元素，并返回数组长度。

4、特点：

①JS中，数组元素的类型可变。

②JS中，数组长度可变。

var arr5 = [1, "abc", true];
document.write(arr5 + "
");
arr5[8] = 25;
document.write(arr5 + "
");

结果：

Date：日期对象

RegExp：正则表达式对象

//  \w：[0-9],[a-z],[A-Z],_
var reg1 = new RegExp("\\w{6,12}");
var reg2 = /\w{6,12}/;
document.write(reg1 + "
");
document.write(reg2 + "
");
			
var username = "zhangsan";
var flag1 = reg1.test(username);
var flag2 = reg2.test(username);
document.write(flag1 + "
");
document.write(flag2 + "
");

Global

结果：

BOM

1、概念

Browser Object Model 浏览器对象模型。将浏览器的各个组成部分封装成对象。

2、组成

(1)Window：窗口对象

①特点：

Window对象不需要创建可以直接使用（window）。例如：window.alter();

window也可以省略。例如：alter();

②方法：

* 与弹出框有关的方法：

alter()：显示带有一段消息和一个确认按钮的警告框。

comfirm()：显示带有一段消息以及确认按钮和取消按钮的对话框。如果用户点击确认按钮，返回true，否则返回false。

prompt()：显示可提示用户输入的对话框。返回值：获取用户输入的值。

* 与打开关闭有关的方法：

open()：打开一个新的浏览器窗口，返回新的Window对象。

close()：关闭浏览器窗口，谁调用关谁。

* 与定时器有关的方法：

setTimeout()：在指定的毫秒数后调用函数或计算表达式。参数：JS代码或者方法对象，毫秒值。返回值：唯一标识，用于取消定时器。

clearTimeout()：取消由setTimeout()方法设置的timeout。

setInterval()：按照指定的周期（毫秒）来调用函数或计算表达式。参数和返回值与setTimeout一样。

clearInterval()：取消由setInterval()设置的timeout。

例子：轮播图

③属性：

* 获取其他BOM对象：history，location，navigator，screen

* 获取DOM对象：document

(2)Location：地址栏对象

(3)History：历史记录对象

(4)Navigator：浏览器对象

(5)Screen：显示器屏幕对象

案例：自动跳转到首页

	
	
	


	

		5秒之后，自动跳转到首页...
	
	
	

 

DOM

1、概念

Document Object Model 文档对象模型。将标记语言文档的各个组成部分，封装为对象，可以使用这些对象，对标记语言文档进行动态操作。

 2、Document：文档对象

* 方法

①getElementById()：根据id属性值获取元素对象，id属性值一般唯一。

②getElementsByTagName()：根据元素名称获取元素对象，返回值是一个数组。

③getElementsByName()：根据name属性值获取元素对象，返回值是一个数组。

④getElementsByClassName()：根据class属性值获取元素对象，返回值是一个数组。

	
	
	


	
aaa
	
	
div1
	
div2
	
div3
	
	

	

	

	
	
div4
	
div5
	
div6
	
	

结果：

3、Element：元素对象

1、通过document来获取和创建。

2、方法

①removeAttribute()：删除属性

②setAttribute()：设置属性

4、Node：节点对象

(1)方法

①appendChild()：向节点的子节点列表的结尾添加新的子节点。

②removeChild()：删除（并返回）当前节点的子节点。

	
	
	


	

		

			div2
		
		div1
	
	
	
	
	

(2)属性

parentNode：返回节点的父节点。

var div2 = document.getElementById("div2");
var div1 = div2.parentNode;
document.write(div1);

 

事件

1、常见的事件

①点击事件：

* onclick：单击事件

* ondbclick：双击事件

②焦点事件：

* onblur：失去焦点

* onfocus：获得焦点

③加载事件：

* onload：一张页面或一幅图像完成加载

④鼠标事件：

* onmousedown：鼠标按钮被按下

* onmouseup：鼠标按键被松开

* onmousemove：鼠标被移动

* onmouseover：鼠标移到某元素之上

* onmouseout：鼠标从某元素移开

⑤键盘事件：

* onkeydown：某个键盘按键被按下

* onkeyup：某个键盘按键被松开

* onkeypress：某个键盘按键被按下并松开

⑥选中和改变：

* onchange：域的内容被改变

* onselect：文本被选中

⑦表单事件：

* onsubmit：确认按钮被点击

2、绑定事件的两种方式：

简单案例

电灯开关：点一下图片，灯泡换一种状态。