一、学习要点
要理解客户端js,必须理解web浏览器所提供的变成环境;下面总结变成环境的几个特性:
1、作为全局对象的window对象和客户端js代码的全局执行环境;
2、客户端对象的层次和过程它的一部分的文档对象模型(DOM);
3、事件驱动的编程模型;
二、详解
(1)、Window对象
1、web浏览器的主要任务是在一个窗口中显示html文档,在客户端js中,表示html文档的是Document对象,window对象代表显示该文档的窗口,window对象是客户端编程中的全局对象,对于js来说很重要;
2、window对象定义了大量的属性和方法,还定义了引用其他重要对象的属性,如Document对象的document属性;
3、由于在客户端js中Window对象是全局对象,因此所有的全局变量都被定义为该对象的属性:如下面两条语句的功能是相同的:
var answer = 42;
window.answer = 42;
4、Window对象代表的是一个web浏览器窗口
(2)DOM(document object model)模型
1、每个Document对象都有一个forms[]数组,它包含的是代表该文档中出现的所有html表单的Form对象,要引用这些表单,可以编码:
window.document.forms[0]
每个Form对象都有一个elements[]数组,该数组包含出现在表单中的各种html表单元素(输入域、按钮等)对象:
parent.frames[0].document.forms[0].elements[3].options[2].text
2、客户端对象层次:
根对象是Window对象:
一级:Window对象
二级:
(1)窗口类:self,window,parent,top
(2)窗口帧数组:frames[];
(3)location;
(4)history
(5)screen;
(6)文档对象:document;
三级:文档对象document下的属性和方法:
(1)Form类数组:forms[]
(2)anchors[];
(3)links[];
(4)图像数组:images[]
(5)applets[];
四级:forms[]下的属性和方法:
elements[].options[].text
(3)事件驱动的编程模型
html文档包含嵌入式的GUI(图形用户接口)
当一个事件发生时,web浏览器会先尝试调用一个合适的事件句柄函数来响应那个事件,因此要编写一个动态的、交互性的客户端js,必须先定义适当的事件句柄。
(4)js在web中的角色:
web浏览器显示那些使用css样式表单来样式化的html结构文本,html定义了内容,css提供了表现形式,而js可以为内容及表现形式增加行为;js的作用就是增强用户的浏览体验,使得信息的获取和传输更加容易;如:
1、创建图像翻滚效果,引导用户,有助页面导航;
2、对表格的各列排序,使用户更容易找到所需的东西;
3、隐藏某些内容,或有选择的显示内容;
4、通过和web直接通信,无需重载页面也能更新数据;