网络学院 w3pop社区 网络资源 IT新闻

w3pop.com :: 网络学院 :: XML :: XML DHTML行为

会员登陆

帐号

密码

回答

记住密码

忘记密码? 注册

XML
XML DHTML行为
XML 相关技术
XML 编辑器
XML 摘要
XML 实例
XML字符编码
xml 文档树
IE和火狐读取XML�..

No. « ‹ 1 2

XML DHTML行为

作者:w3pop.com 翻译/整理:w3pop.com 发布:2007-04-29 修改:2007-08-16 浏览:3104 :: ::

Internet Explorer 5 introduced DHTML behaviors. Behaviors are a way to add DHTML functionality to HTML elements with the ease of CSS.
IE5介绍了DHTML行为。行为能够更加轻松的使用层叠式样式表（CSS）将DHTML功能添加到HTML元素的一种方法。

Behaviors - What are They?
什么是行为 — 它们到底是什么？

IE5 introduced DHTML behaviors. Behaviors are a way to add DHTML functionality to HTML elements with the ease of CSS.
IE5介绍了DHTML行为。行为能够更加轻松的使用层叠式样式表（CSS）将DHTML功能添加到HTML元素的一种方法。

How do behaviors work? By using XML we can link behaviors to any element in a web page and manipulate that element.
行为是怎样运行的？通过使用XML，我们可以把行为与所有页面中的元素相互连接起来，并对元素进行操作。

DHTML behaviors do not use a <script> tag. Instead, they are using a CSS attribute called "behavior". This "behavior" specifies a URL to an HTC file which contains the actual behavior (The HTC file is written in XML).
DHTML行为并不使用<script>标签，它们使用的是名为"behavior"的CSS属性。这个“行为”指定了一个HTC文件（HTC文件是写在XML中的）的URL链接，该文件包含了真正使用的行为。

Syntax
语法

behavior: url(some_filename.htc)

Note: The behavior attribute is only supported by IE 5 and higher, all other browsers will ignore it. This means that Mozilla, Firefox, Netscape and other browsers will only see the regular content and IE 5+ can see the DHTML behaviors.
注意：行为属性只被IE5及其更高版本的浏览器支持，所有其它的浏览器都会忽略它。这意味着在Mozilla、Firefox、Netscape和其它浏览器上只能看到常规内容，而IE5还可以看到DHTML行为。

Example
例子

The following HTML file has a <style> element that defines a behavior for the <h1> element:
下面的HTML文件包含了一个用于定义<h1>元素行为的<style>元素：

<html>

<head>
<style type="text/css">
h1 { behavior: url(behave.htc) }
</style>
</head>

<body>
<h1>Mouse over me!!!</h1>

</body>
</html>

The XML document "behave.htc" is shown below:
下面列举的是XML文档 "behave.htc"：

<attach for="element" event="onmouseover" handler="hig_lite" />

<attach for="element" event="onmouseout" handler="low_lite" />

<script type="text/javascript">
function hig_lite()
{
element.style.color='red'
}
function low_lite()
{
element.style.color='blue'
}
</script>

The behavior file contains a JavaScript and the event handlers for the script.
行为文件包含了JavaScript 和处理脚本程序的事件处理器。

Try it yourself (mouse over the text in the example).
尝试一下 (把鼠标移动到文字上方).

The following HTML file has a <style> element that defines a behavior for elements with an id of "typing":
下述HTML文件包含一个ID为"typing" 的元素的行为<style>元素：

<html>
<head>
<style type="text/css">
#typing
{
behavior:url(typing.htc);
font-family:'courier new';
}
</style>
</head>

<body>

<span id="typing" speed="100">IE5 introduced DHTML behaviors.
Behaviors are a way to add DHTML functionality to HTML elements
with the ease of CSS.<br /><br />How do behaviors work?<br />
By using XML we can link behaviors to any element in a web page
and manipulate that element.</p>
</span>
</body>

</html>

The XML document "typing.htc" is shown below:
下面列举的是XML文档"typing.htc"：

<attach for="window" event="onload" handler="beginTyping" />

<method name="type" />
<script type="text/javascript">
var i,text1,text2,textLength,t
function beginTyping()
{
i=0
text1=element.innerText
textLength=text1.length
element.innerText=""
text2=""
t=window.setInterval(element.id+".type()",speed)
}
function type()
{
text2=text2+text1.substring(i,i+1)
element.innerText=text2
i=i+1
if (i==textLength){clearInterval(t)}
}
</script>

自己尝试一下

评论 (3) 1 All