主题:  IE 永远未老,DHTML行为独好(自chinabyte)一

5D荣誉斑竹

职务:版主
等级:3
金币:10.0
发贴:786
注册:2000/9/15 21:25:59
#12001/2/1 9:55:30
原文出处:http://www.webreference.com/js/column22/index.html

  

本文将介绍 IE 浏览器的一个重要新功能:DHTML 行为,它是 IE 5.x 版本中免费提供的功能。DHTML 行为可以为动态 HTML 元素创建自包含的格式定义。在 Internet Explorer 4.0 里,如果使用两个行为相似的元素,除了分别定义它们以外,你别无其他的选择方法。5.x 版本允许通过一个叫作 Behavior 的格式设计、定义多个元素,Behavior 在面向对象语言的方面给 javascript 带来了一系列概念,例如隐藏细节、封装、代码复用和过程化接口。

   我们将通过一个“显示一个不停闪动的转动足球”的例子解释 Behavior。我们先不通过 Behavior 实现它,然后演示如何通过 Behavior 实现同样的任务。最后将强调这样做的优点。

   这里是 Behavior scriptlet 和 HTML 页面 的代码清单。

   原则上,可以在 Internet Explorer 4.x 中仿真 Behavior 功能。在我们的例子里,可以使用 IE 4.x 的 DHTML 对象创建一个闪动的图形,并通过操纵图形对象的属性如 visibility、left 和 top 来控制图形的可见性和移动它们。以下是完整的脚本:

< HTML>
< HEAD>
< TITLE> Soccer: World Cup is Over < /TITLE>
< /HEAD>
< BODY ONLOAD="soccerOnload()">
< DIV ID="soccer" STYLE="position:absolute; left:200; top:250">
    < IMG SRC="bigsoccer.gif">< /DIV>
< SCRIPT LANGUAGE="javascript">
var msecs = 2000;
var counter = 0;

function soccerOnload() {
setTimeout("blink()", msecs);
}

function blink() {
soccer.style.visibility =
    (soccer.style.visibility == "hidden") ? "visible" : "hidden";
counter +=1;
if (counter == 10) {
alert("Fifth Blink Point");
counter = 0;
}
setTimeout("blink()", msecs);
}

< /SCRIPT>
< /BODY>
< /HTML>
   注意我们在闪动足球里添加了一个小功能:每隔五次闪动就弹出一个警报窗口。例子中使用了一个简单的事件,在本文后面的内容里,我们就可以很容易地解释如何通过 Behavior 来实现这个事件。

Scriptlet 是在 HTML 页面中引用的独立脚本。它描述一个从外部接收数据并支持对这些数据进行操作的对象。Scriptlet 描述对象的行为和触发它的事件,它还允许你定义新的事件。Internet Explorer 4.0 以上版本支持 Scriptlet,但 Netscape Navigator 不支持它。Internet Explorer 5.0 中添加了对 Scriptlet Behavior 的支持。Scriptlet 保存在它自己的文件里,文件的扩展名 .sct。Scriptlet 文件由 < SCRIPTLET> 标记开始并以 < /SCRIPTLET> 标记结束:

< SCRIPTLET>......< /SCRIPTLET>
   Scriptlet 分为两个部分:接口定义部分和内部实现部分。接口定义部分包括 IMPLEMENTS 标记,每个 IMPLEMENTS 标记 以 < IMPLEMENTS> 开始并以 < /IMPLEMENTS> 标记结束。有两种 < IMPLEMENTS> 标记: < Behavior> 和 < Automation>。< Behavior> 指明同 Behavior 相联的事件,例如:

< IMPLEMENTS ID="kuku" TYPE="Behavior" DEFAULT>
< EVENT NAME="onFifthBlink"/>
< /IMPLEMENTS>
   < IMPLEMENTS> 标记的 Automation 类型指明 Scriptlet 的对象接口参数和它所支持的方法:

< IMPLEMENTS TYPE="Automation">
< METHOD NAME="blink"/>
< PROPERTY NAME="x"/>
< PROPERTY NAME="y"/>
< /IMPLEMENTS>
   内部实现部分由 javascript 脚本组成。此脚本实现了对象方法的内部细节。在以上的例子代码里只定义了一个事件 blink() 函数。以下是内部实现部分的完整内容:

< SCRIPT LANGUAGE="javascript">
var msecs =2000;
var counter = 0;
style.position = "absolute";
style.pixelTop = x;
style.pixelLeft = y;
window.attachEvent("onload", onload);

function onload(){
window.setTimeout(uniqueID+".blink()", msecs);
}

function blink() {
style.visibility = (style.visibility == "hidden") ? "visible" : "hidden";
counter +=1;
if (counter == 10) {
fireEvent("onFifthBlink");
counter = 0;
}
window.setTimeout(uniqueID+".blink()", msecs);
}
< /SCRIPT>
   随后详细介绍以上的各个部分。

编辑历史:[这消息被反斗星编辑过(编辑时间2001-02-01 10:02:18)]


eboy

职务:普通成员
等级:1
金币:0.0
发贴:9
注册:2001/1/31 13:50:55
#22001/2/2 17:58:30
这样的文章多多来几篇!!谢谢



semon

职务:普通成员
等级:3
金币:1.0
发贴:896
注册:2000/9/15 13:43:14
#32001/2/3 0:22:47
说实话,感到有点悲哀,ie在自说自话,我们也没有办法。纯粹的企业行为、没有成为标准却能取代实际上的标准,到底是喜还是忧呢?
我无所适从。



QQlan

职务:版主
等级:1
金币:1.0
发贴:158
注册:2000/9/19 10:35:21
#42001/2/3 2:42:48
怎么说呢,
有时候IE的行为特别逗...微软除了自说自话还喜欢自相矛盾.
比如 HTML 标记 , frontpage里有选项支持这种效果(就是文字闪烁),
但是如果使用该文字闪烁, 这几个文字在IE中死活不闪烁
可是使用NS浏览, 这几个字傻兮兮的闪呀闪的....

说到NS, IE和javascript, 两个browser都有自己的标准,
都有各自的特色, 有时侯NS支持的差些, 有时候为IE写的代码复杂些...
虽然带来很多麻烦, 但是如果都按标准的话, 也有局限, 比如HTML是标准
但是要导入一个外部文件, html就做不到, 而必须使用browser的非标准支持,
NS内嵌LAYER; IE内嵌IFRAME
同时使用这两个标记可以导入外部文件比如.htm或者.js之类...

---------------------------------------------------------------------------------------
BTW: 可以利用javascript在IE中实现文字blink (闪烁):
文件里:



文件里:

该文字闪烁

编辑历史:[这消息被QQlan编辑过(编辑时间2001-02-03 02:46:17)]