网络应用程序设计.pptxVIP

2025-7-24

1

DHTML导论

段会川

山东师范大学信息科学与工程学院

2006年12月

目录

面向对象的程序设计OOP

属性(Properties)

方法(Methods)

String对象

Date对象

数组(array)对象

布尔对象(Boolean)

Math对象

Math对象的属性

Math对象的方法

其他的JavaScript对象

目录

HTMLDOM对象

HTMLDOM所包括的各种对象

检测浏览器

JavaScriptCookies

使用JavaScript进行表单验证

JavaScript动画

变量的声明和赋值

将JavaScript应用于分块图片(ImageMaps)

JavaScript的定时事件

01

JavaScript中的对象概念

02

JavaScript小结

03

JavaScript之后…

04

JavaScript小测验

05

摘要幻灯片(续)

DHTML的是DynamicHTML的缩写,即动态HTML

01

DHTML是使网页动起来的艺术!

02

DHTML是创建动态和交互站点两种web技术结合在一起的产物

03

对于大部分人来说,DHTML是HTML,样式单(StyleSheets)和JavaScript的结合体

04

DHTML的特点

HTML以及网页设计的基础知识

层叠样式单CSS

脚本语言JavaScript

学习DHTML的先决条件

DHTML不是一个W3C标准

DHTML不是W3C定义的标准.

DHTML是一个市场术语(marketingterm)–即它被Netscape和Microsoft用于描述其4.x代的浏览器所支持的新技术

DHTML是多种创建动态Web站点技术相结合的产物

对于大部分来说,DHTML意味着HTML4.0,样式单(StyleSheets)和JavaScript的结合

DHTML是某些商家对于将HTML,样式单(stylesheets)和脚本语言结合在一起而创建动态网站技术的一种描述.W3C如是说.

使用DHTML,Web开发者可以控制HTML元素在浏览器中的显示方式和位置

HTML4.0

使用HTML4.0可以将所有的格式化信息从HTML文档分离出来,放入另一个样式单文件中.

由于HTML4.0分离了展示和结构,我们就能在不纠缠进文档内容的情况下完全地控制展示布局

DHTML技术

使用CSS,我们就拥有了关于HTML文档的样式和布局模型

CSS是Web设计的一次突破,因为它允许开发者统一地控制多个网页的样式和布局.Web开发者可以为某个HTML元素定义样式,并将它应用到任何期望的网页上.要想全局性地改变一个网页元素的展示效果,只要改变所对应的样式即可.

层叠样式单CSS(CascadingStyleSheets)

DHTML技术

HTMLDOM是HTML的文档对象模型

HTMLDOM为HTML定义了一个标准的对象集合,以及访问和操纵这些对象的标准操作

W3C文档对象模型(DOM)是一项平台和语言无关的接口技术,它允许程序和脚本语言动态地访问和更新文档的内容,结构和样式.

文档对象模型DOM(DocumentObjectModel)

01

JavaScript允许你编写程序控制所有的HTML元素

JavaScript

02

DHTML技术

2025-7-24

11

IE4.x和Netscape4.x所支持的DHTML

IE4.x

跨平台的DHTML

Netscape4.x

VisualFilters(在文本和图片上应用可视化效果)

DynamicCSS(控制元素的位置和可见性)

CSS1

CSS2(统一控制不同元素的可视效果)

CSSPositioning(控制元素位置和可见性)

JavaScript

JSS(JavaScript样式单)(统一控制不同元素的可视效果)

Layers(控制元素的位置和可见性)

只要每种浏览器创建其自身专有的特性和技术,那么编写DHTML就会遇到很多浏览器兼容问题.一个网页可能在一种浏览器中非常漂亮,而在另一种浏览器中非常糟糕

DHTMLCSS-P(CSSPositioning,CSS定位)

可与CSS-P一起使用的属性

元素必须指定定位属性(相对或绝对)

此后可使用如下的CSS-P属性:

left–元素的左侧位置

top–元素的上端位置

visibility–指明元素是否可见

z-index–元素的z方向排放次序

clip–元素的裁剪

overflow–溢出的内容如何处置

CSS定位

相对定位(position:relative)示例二