浏览器程序设计

来源：互联网发布：mac qq远程控制编辑：程序博客网时间：2024/05/16 08:38

1.模型

文档对象模型（Document Object Model，DOM）；浏览器对象模型（Broswer Object Model,BOM）如下：

2.window对象

代表浏览器的框架或浏览器的窗体，它是一个全局对象，故window可省略。常用的方法有：alert（），prompt（）;属性有：defaultStatus浏览器窗口状态栏默认信息。window对象的某些属性本身也是一个对象，如：

document 浏览器中的页面，

navigator 包含了浏览器自身的相关信息，

history 保存了用户访问过的页面历史信息，

screen 包含了客户端计算机显示器显示能力信息，

location 浏览器加载的当前页面的URL详细信息。

3.history对象

属性：length 获得浏览器历史栈中页面的个数

方法：back() 当前页面的location改变为历史栈中当前页面的后一个页面

forward() 当前页面的location改变为历史栈中当前页面的前一个页面

go(n) 以当前页面为基准，在历史栈中前进或后退n个页面

history.go(-1) 等价于 history.back()

history.go(1) 等价于 history.forward()

4.location对象

属性：href hostname port protocol

方法：replace（）从浏览器历史栈中移除当前页面，用新页面替换

注：href导航到新页面，则新页面加载历史栈的顶部

5.screen对象

属性：height 客户端计算机显示屏的垂直高度，以像素为单位

width 客户端计算机显示屏的水平宽度，以像素为单位

colorDepth 客户端显示屏颜色的色彩位数

6.document对象

方法：write()

属性：bgColor forms[]

images[] 对于<img name=myImage src=”us.gif”>的HTML代码，浏览器自动创建对应的img对象，对象名为myImage；页面上的每一个img对象都保存在images[]数组中，如页面的第一幅图片用document.images[0],第二幅图片用document.images[1].也可通过名称来访问images数组中的img对象，如上面的HTML创建的img对象可以通过document.images[“myImage”]访问。

<html><body ><img name=img_snow src="" ><script language="JavaScript" type="text/javascript">var myImages=new Array("monk.jpg","fullmonk.jpg","sexwoman.jpg");var imgIndex=prompt("Enter a number from 0 to 2","");document.images["img_snow"].src=myImages[imgIndex];</script></body></html>

links[] 用于表示页面上所有A对象的集合。对于每一个有href属性的超链接标记<A>,浏览器将创建一个对应的A对象，

7.navigator对象

属性：appName 返回浏览器的原型，如Microsoft Internet Explorer

userAgent 返回包含了浏览器的版本、操作系统名称、浏览器原型等信息的字符串。

8.将事件处理代码连接到web页面

1）将事件处理器作为HTML标记的属性

事件处理器代码只有一行的写法：

<A href=”somepage.htm” name=”linkSomePage” onclick=”alert(‘You Clicked?’)”>Click Me</A>

当事件处理器代码有多行时，可以把事件处理代码定义为一个函数，然后再onclick中调用这个函数，如：

<html><body ><script language="JavaScript" type="text/javascript">function linkSomePage_onclick(){alert('You Click?');return false;}</script><A href="ch5_example3.htm" name="linkSomePage" onclick="return linkSomePage_onclick()">Click Me</A></body></html>

注解：事件处理器onclick返回的值被Javascrip用来决定超链接是否执行默认行为，即是否链接到新页面；如返回值为true，则执行默认行为，如返回值为false，则不执行链接；对于IE，只有当linkSomePage_onclick()中return false，并且onclick="return linkSomePage_onclick()"中有return时，才能使onclick返回值为false，即不执行链接行为，其它情况默认执行链接行为。

window对象具有load事件和unload事件，其事件处理器应放在<body>标记中，如：

<body language=”JavaScript” onload=”myOnLoadfunction()” onunload=”myOnUnloadfunctiong()”>

2）将事件处理器作为浏览器对象的属性

<html><body ><script language="JavaScript" type="text/javascript">function linkSomePage_onclick(){alert('This link is going nowhere');return false;}</script><A href="ch5_example3.htm" name="linkSomePage" >Click Me</A><script language="JavaScript" type="test/javascript">document.links[0].onclick=linkSomePage_onclick;</script></body></html>

注：document.links[0].onclick=linkSomePage_onclick处，函数linkSomePage_onclick后没有圆括号

9.浏览器不支持脚本时怎么办

可以使用<noscript>标记，位于<noscript>标记内额任何HTML代码，尽在浏览器不支持Javascript时或浏览器禁用了Javascript支持时才向用户显示。

参考：《JavaScript入门经典(第3版)》