编程htc的使用

来源：互联网发布：淘宝美工难吗编辑：程序博客网时间：2024/04/29 07:26

效果: 鼠标滑过文字的时候会变颜色

注意的问题:
htc 只能在IE浏览器上使用(IE 5.5以上)
在火狐浏览器不被支持

基础知识:

在微软(R)Internet Explorer 5中介绍，HTML组件(HTCs)提供一种机制来使用脚本作为动态HTML(DHTML)行为实现组件功能。以.htc扩展名保存，一份HTC是一份包含脚本和一组用

于定义组件的HTC特殊元素的HTML文件。此部分包含相关元素和它们支持的成员。

对象
     document                                在给定的浏览器窗口中表现HTML文档。
     element                          返回一份主文档中连接行为的标签的参考。
     PUBLIC:ATTACH                    绑定一个函数到一个事件上，因此每次事件发生在特殊对象上时函数会被调用。
     PUBLIC:COMPONENT   以HTC指明文件的内容。
     PUBLIC:DEFAULTS       设定一份HTC的默认属性。
     PUBLIC:EVENT             定义一个HTC的事件，使之暴露于包含该HTC的文档。
     PUBLIC:METHOD        定义一个HTC的方法，使之暴露于包含该HTC的文档。
     PUBLIC:PROPERTY              定义一个HTC的属性，使之暴露于包含该HTC的文档。

方法
createEventObject
创建一个事件对象，当需要传递事件附加信息给PUBLIC:EVENT元素的fire方法时使用。

事件
     oncontentready
     连接了行为的元素的内容完全被解析时发生。
     oncontentsave
     连接了一份元素行为的一个元素的内容被保存或复制前发生。
     ondetach
     从一个元素解除一份行为的连接前发生。
     ondocumentready
     当包含行为的文档完全被解析时发生。

下面说一下我的步骤:

1. 创建一个htc文件(hilite.htc)

HTC代码

<PUBLIC:COMPONENT> <PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilite()" /> <PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="Restore()" /> <SCRIPT LANGUAGE="JScript"> var normalColor, normalSpacing; function Hilite() { // save original values normalColor = runtimeStyle.color;  normalSpacing= runtimeStyle.letterSpacing; runtimeStyle.color = "red"; runtimeStyle.letterSpacing = 2; } function Restore() { // restore original values runtimeStyle.color = normalColor; runtimeStyle.letterSpacing = normalSpacing; } </SCRIPT> </PUBLIC:COMPONENT>

2. 创建一个测试页面 (WebForm1.aspx)

HTML前台代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication3.WebForm1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title>无标题页</title>    <style type="text/css">        LI        {            behavior: url(hilite.htc);        }    </style></head><body>    <form id="form1" runat="server">    <ul>        <li>网页陶吧</li>        <li>homepage.yesky.com</li>    </ul>    </form></body></html>

结束语: 可以看到效果 (当鼠标滑过文字的时候会变化颜色)