文档介绍：应用系统开发导论
JavaScript(下)
1
内容
浏览器中使用JavaScript的方法
浏览器顶层对象window
经典文档对象模型(DOM0)
事件与事件处理
JavaScript常见错误
2
浏览器中使用JavaScript的方法
回顾浏览器中调用CSS的三种方法
链接标记的URL
HTML元素的事件处理
页面的script元素中
外部脚本
3
链接标记的URL
<a href = "Javascript: alert('Hi !');" >Click Me </a>
一般不用
HREF中的"Javascript:"的协议头一定要加,其中可以写多句脚本,但不能写return语句。
4
HTML元素的事件处理
<a href = "#" onclick = "Javascript: alert('Hello !');return false;"> Click Me Too</a>
这种做法比较简单,比较常用。return false 是为了禁止页面跳转
通常"Javascript:"的协议头可以不加,简写为 onclick= "alert('Hello !');return false;"。
5
页面的script元素中
<script language="javascript" type="text/javascript">
<!--//--><![CDATA[//><!--
function testJs(){
alert('Hello !');
...
}
//--><!]]>
</script>
...
<a href = "#" onclick = " testJs();return false;">Click Me Again</a>
<script>元素通常都放在<head>元素内。
6
外部脚本文件中
[外部脚本文件 ]
<!--//--><![CDATA[//><!--
function testJsExt(){
alert('Ohhh No!');
...
}
//--><!]]>
[HTML文件*.htm ]
<script language="javascript" type="text/javascript" src="mat/js/"> </script>
...
<a href = "#" onclick ="testJsExt();return false;">Click Me Nowww! </a>
但是由于把脚本和HTML做了完全的分离,所以是商业开发领域最常用的方法
7
浏览器顶层对象window
8
window对象概述
JavaScript中所有变量和函数都能上溯到一个顶层对象,当JavaScript运用到Web客户端编程时,这个顶层对象就是window。浏览器在成功载入页面之后会创建一个以window根的对象树,这棵对象树相关的接口规范也被称之为BOM,浏览器对象模型(Browser Object Model)。
在不用with语句的情况下,默认作用域的第一个元素就是顶级元素window,所以在访问window属性时可以省略对象名window。
9
浏览器对象模型中的对象层次图
10