|
World Wide Web，简称WWW、3W、W3或Web，是Internet上最为热门的
应用。任何一台连入Internet、具有自己的IP地址的计算机，只要运行Web
服务软件，便可以让Internet上所有的计算机通过浏览器浏览到其提供的
文本、图像、声音及动画等信息。
在这种意义下，World Wide Web犹如各企事业单位的门面与广告，代
表着单位的形象。因此，各Web制作者都想方设法让Web显得生动活泼，能
吸引更多的浏览者。让Web上显示的内容动起来便是其一。
本文讨论的动态显示是指在不需要浏览者操作的情况下而能使Web上显
示的内容出现变化。本文的例子以使用Netscape 2.01以上的浏览器为基准。
一、利用HTML语言本身的功能实现动态显示
HTML语言是Web的脚本化编程语言，用一般的文本编辑器如Edit、
Notepad等或专门的HTML语言写作工具如HotDog、HotMetal等都可以编写
HTML文档。将编写好的HTML文档存放在Web服务软件指定的目录中即可让
Internet用户浏览到其内容。此外，单机用户也可以将HTML文档存放在本
地目录，直接用浏览器打开浏览。HTML文档的基本结构为：
< HTML >
< HEAD >
< TITLE >标题名称< /TITLE >
< /HEAD >
< BODY >
要在浏览器中显示的内容
< /BODY >
< /HTML >
在< BODY >与< /BODY >之间可添上欲在浏览器中显示的内容及其控制
标签。如：
< HTML >
< HEAD >
< TITLE >Example< /TITLE >
< /HEAD >
< BODY >
This is a example
< /BODY >
< /HTML >
将在浏览器的窗口中显示：This is a example字样。
1、利用< blink >标签实现字符的闪动
让Web上的某些字符闪动起来，具有醒目的作用，可以吸引浏览者的
注意。 利用< blink >标签可以实现此功能。如在上例中，如果要让
“This is a example”这几个字闪动起来，可以在其前面加上< blink >
标签。HTML文档如下：
< HTML >
< HEAD >
< TITLE >Example< /TITLE >
< /HEAD >
< BODY >
< blink > This is a example< /blink >
< /BODY >
< /HTML >
浏览器在遇到< blink >标签时将自动将后面的字符串闪烁显示。
如果只想让This is a example中的a example闪动，可以用
< /blink > 来结束< blink >作用。如：
< HTML >
< HEAD >
< TITLE >Example< /TITLE >
< /HEAD >
< BODY >
This is < blink >a example < /blink >
< /BODY >
< /HTML >
利用< blink >标签还可以使具有链接功能的文本闪动，如下面的HTML
文件将在屏幕上显示：Welcome to my homepage，其中my homepage将不
断地闪动， 点击后将浏览到相应的Homepage。
< HTML >
< HEAD >
< TITLE >Examp1< /TITLE >
< /HEAD >
< BODY >
Welcome to
< a href="http://www.shu.edu.cn/~xyx" >
< blink >my homepage< /blink >
< /a >
< /BODY >
< /HTML >
2.利用< META >标签实现Web的自动跳转
在Web上显示一段欢迎信息，隔一定秒数后，自动跳转到其他的Web页
面，由此可以造成新奇的效果。其实现方法是在< HEAD >与< /HEAD >标签
之间加上如下语句：
< meta http-equiv="Refresh" content="秒数; url=跳转的文件或地址" >
如将一个显示欢迎信息的图像：welcome.gif存放在与HTML文档同一个
目录中，则下面的HTML文件将在浏览器中显示该图像，3 秒钟后将自动跳
转到上海大学的主页：http://www.shu.edu.cn。
< HTML >
< HEAD >
< TITLE >WELCOME< /TITLE >
< meta http-equiv="Refresh" content="3; url=http://www.shu.edu.cn" >
< /HEAD >
< BODY >
< IMG SRC="welcome.gif" >
< /BODY >
< /HTML >
利用此技术还可实现Web页面背景的自动变化。 其方法是制作两个或
多个内容相似而背景不同的页面，让其每隔一定时间自动相互跳转。
|
1.简介
SSI（Server Side Include)，通常称为服务器端嵌入，是一种类似于ASP的基于服务器的网页制作技术。大多数（尤其是基于Unix平台）的WEB服务器如Netscape Enterprise Server等均支持SSI命令。
SSI工作原理：
在一个通常以.shtml为扩展名的SSI文件中，标准的HTML编码会被直接送到浏览器上，而内嵌Perl语言形式的SSI命令则先被网络服务器解释执行，如果是标准输出的话，输出信息也将作为标准的HTML而被送至浏览器。
SSI简单应用实例：
〈html〉
〈head〉〈title〉my first SSI page〈/title〉〈/head〉
〈body〉
欢迎您（于〈!－－＃ echo var="date_local" －－〉）访问本网站。
〈/html〉
标记在上面文档中的“〈!－－＃ －－〉”结构表明了SSI命令会被服务器翻译执行，而不是直接送到客户端。我们可以在浏览器中用“查看→源文件"观察源代码：
〈html〉
〈head〉〈title〉my first SSI page〈/title〉〈/head〉
〈body〉
欢迎您（于dec 06 1999）访问本网站。
〈/html〉
我们发现，文档中的html被直接传到了客户端，而SSI命令得到了执行。SSI代码在客户端是不可见的，客户端只能看到它执行的效果。
一个比较实用的例子
网站维护常常碰到的一个问题是，网站的结构已经固定，却为了更新一点内容而不得不重做一大批网页。SSI提供了一种简单、有效的方法来解决这一问题，它将一个网站的基本结构放在几个简单的HTML文件中（模板），以后我们要做的只是将文本传到服务器，让程序按照模板自动生成网页，从而使管理大型网站变得容易。如：
〈html〉
〈head〉〈title〉SSI example〈/title〉〈/head〉
〈body〉
〈h2〉新闻〈/h2〉
〈p〉〈!－－＃ include file="news.txt" －－〉
〈p〉新闻更新日期：〈!－－＃ flastmod file="news.txt" －－〉
〈/body〉
〈/html〉
将频繁的更新内容放在news.txt中，SSI会通过 include 指令将其内容包含到输出的网页中。通过 flastmod 指令可在网页中显示new.txt的最近一次更改日期。
构建学习SSI的环境
支持SSI的web server 很多，如可以选用omnihttpd profeSSIonal， 这是一款win 95/98平台下的支持SSI的web服务器。可直接从http://www.omnicron.ab.ca/httpd/下载这一共享软件。
SSI指令使用祥解
1.#echo
作用：
将环境变量插入到页面中。
语法：
<!--#echo var=”变量名称”-->
示例：
本文档名称：<!--#echo var=”DOCUMENT_NAME”-->
现在时间：<!--#echo var=”DATE_LOCAL”-->
你的IP地址是：<!--#echo var=”REMOTE_ADDR”-->
可在SSI中使用的变量： 1．只有SSI中能使用的变量。2．标准CGI变量3．某些服务器支持的变量
①下面是在标准SSI支持的变量：
变量名称
作用
示例
1
DOCUMENT_NAME
当前文档名
echo.html
2
DOCUMENT_URL
或DOCUMENT_URI
当前文档相对URL
/ssi/echo.html
3
QUERY_STRING_UNESCAPED
或QUERY_STRING
所发送的查询字符串
sample
4
DATE_LOCAL
服务器中当前日期
Sun, 23 May 1999 21:54:30
5
DATE_GMT
以格林威冶时间设置的服务器时间
Sun, 23 May 1999 13:54:30
6
LAST_MODIFIED
当前文档最后修改时间
23-May-1999 PST
②标准的CGI变量
WEB上关于CGI环境变量测试的示例：
LINUX下Apache：http://hoyi.zb169.net/cgi-bin/hiecho.cgi?sample
Freebsd下Apache: http://hoyi.onlineexpress.net/cgi-bin/hiecho.cgi?sample
CGI环境变量名称
作用
示例
1
AUTH_TYPE
用户所使用的身份验证类型
2
CONTENT_LENGTH
服务器输出文本长度
0
3
HTTP_ACCEPT
客户机可接受的MIME类型
application/vnd.ms-excel, application/msword, */*
4
HTTP_USER_AGENT
客户机浏览器配置状况
Mozilla/4.0 (compatible; MSIE 4.01; Windows 98)
5
GATEWARY_INTERFACE
服务器所使用的 CGI 规范的修正版
CGI/1.1
6
PATH_INFO
客户端给出附加路径信息
7
PATH_TRANSLATED
PATH_INFO 的值，但带有扩展为某个目录规范的虚拟路径
/v/spool/webadm/html
8
QUERY_STRING
在引用该脚本的 URL 中跟在问号 (?) 后面的信息
Sample
9
REMOTE_ADDR
客户机IP地址
202.103.27.103
10
REMOTE_HOST
客户机名称
11
REQUEST_METHOD
HTTP请求方法
GET
12
SCRIPT_NAME
当前脚本名称
/cgi-main/cgiwrap/hoyi/hiecho.cgi
13
SERVER_NAME
服务器名称或IP地址
hoyi.zb169.net
14
SERVER_PORT
服务器接请求的TCP/IP端口
80
15
SERVER_PROTOCOL
与请求有关的信息检索协议的名称与版本，通常为 HTTP/1.0
HTTP/1.1
16
SERVER_SOFTWARE
响应请求的 Web 服务器软件的名称和版本
Apache/1.3.6 (Unix)
2、#include
作用：
将文本文件的内容直接插入到文档页面中。
语法：
<!--#include file=”文件名称”-->
<!--#include virtual=”文件名称”-->
file 文件名是一个相对路径，该路径相对于使用 #include 指令的文档所在的目录。被包含文件可以在同一级目录或其子目录中，但不能在上一级目录中。如表示当前目录下的的nav_head.htm文档，则为file=”nav_head.htm”。
virtual 文件名是 Web 站点上的虚拟目录的完整路径。如表示相对于服务器文档根目录下hoyi目录下的nav_head.htm文件；则为file=”/hoyi/nav_head.htm”
参数：
file 指定包含文件相对于本文档的位置
virtual 指定相对于服务器文档根目录的位置
注意：
1、文件名称必须带有扩展名。
2、被包含的文件可以具有任何文件扩展名，我觉得直接使用htm扩展名最方便，微软公司推荐使用 .inc 扩展名（这就看你的爱好了）。
示例：
<!--#include file=”nav_head.htm”-->将头文件插入到当前页面
<!--#include file=”nav_foot.htm”-->将尾文件插入到当前页面
2、#include
作用：
将文本文件的内容直接插入到文档页面中。
语法：
<!--#include file=”文件名称”-->
<!--#include virtual=”文件名称”-->
file 文件名是一个相对路径，该路径相对于使用 #include 指令的文档所在的目录。被包含文件可以在同一级目录或其子目录中，但不能在上一级目录中。如表示当前目录下的的nav_head.htm文档，则为file=”nav_head.htm”。
virtual 文件名是 Web 站点上的虚拟目录的完整路径。如表示相对于服务器文档根目录下hoyi目录下的nav_head.htm文件；则为file=”/hoyi/nav_head.htm”
参数：
file 指定包含文件相对于本文档的位置
virtual 指定相对于服务器文档根目录的位置
注意：
1、文件名称必须带有扩展名。
2、被包含的文件可以具有任何文件扩展名，我觉得直接使用htm扩展名最方便，微软公司推荐使用 .inc 扩展名（这就看你的爱好了）。
示例：
<!--#include file=”nav_head.htm”-->将头文件插入到当前页面
<!--#include file=”nav_foot.htm”-->将尾文件插入到当前页面
4.#exec
作用：
将某一外部程序的输出插入到页面中。可插入CGI程序或者是常规应用程序的输入，这取决于使用的参数是cmd还是cgi。
语法：
语法：
<!--#exec cmd=”文件名称”-->
<!--#exec cgi=”文件名称”-->
参数：
cmd 常规应用程序
cgi CGI脚本程序
示例：
<!--#exec cmd=”cat /etc/passwd”-->将会显示密码文件
<!--#exec cmd=”dir /b”-->将会显示当前目录下文件列表
<!--#exec cgi=”/cgi-bin/gb.cgi”-->将会执行CGI程序gb.cgi。
<!--#exec cgi=”/cgi-bin/access_log.cgi”-->将会执行CGI程序access_log.cgi。
注意：
从上面的示例可以看出，这个指令相当方便，但是也存在安全问题。
禁止方法：
．Apache，将access.conf中的”Options Includes ExecCGI”这行代码删除；
．在IIS中，要禁用 #exec 命令，可修改 SSIExecDisable 元数据库；
5.#config
作用：
指定返回给客户端浏览器的错误信息、日期和文件大小的格式。
语法：
<!--#config errmsg=”自定义错误信息”-->
<!--#config sizefmt=”显示单位”-->
<!--#config timefmt=”显示格式”-->
参数：
errmsg 自定义SSI执行错误信息，可以为任何你喜欢的方式。
sizefmt 文件大小显示方式，默认为字节方式(“bytes”)可以改为千字节方式(“abbrev”)
timefmt 时间显示方式，最灵活的配置属性。
代码
示例
作用
代码
示例
作用
%a
Mon
缩写的星期几
%m
05
月份数
%A
Monday
星期几
%M
55
分
%b
%h
Aug
缩写的月份名
%p
AM
上、下午(AM或PM)
%r
10:20:20 AM
12小制时间
%B
Auguest
月份名
%s
40
秒
%d
01
当月第几天
%T
20:20:30
24小制时间
%D
05/28/99
数字日期
%U
%W
21
一年中的星期
%e
1
当月第几天，前面不放0
%w
2
从星期天至今天数
%H
20
小时(24小时制)
%y
99
2位数格式的年号
%I
08
小时(12小时制)
%Y
1999
4位数表示的年号
%j
320
一年中的天数
%z
PDT
时区位置
示例：
显示一个不存在文件的大小
<!--#config errmsg=”服务器执行错误，请联系管理员 yiho@126.com，谢谢！”-->
<!--#fsize file=”不存在的文件.htm”-->
以千字节方式显示文件大小
<!--#config sizefmt=”abbrev”-->
<!--#fsizefile=”news.htm”-->
以特定的时间格式显示时间
<!--#config timefmt=”%Y年/%m月%d日 星期%W 北京时间%H:%M:%s，%Y年已过去了%j天 今天是%Y年的第%U个星期”-->
<!--#echo var=”DATE_LOCAL”-->
显示今天是星期几,几月,时区
<!--#config timefmt=”今天%A, %B ,服务器时区是 %z，是”-->
<!--#echo var=”DATE_LOCAL”-->
6.XSSI
XSSI（Extended SSI）是一组高级SSI指令，内置于Apache 1.2或更高版本的mod-include模块之中。
其中可利用的的指令有：
#printenv
#set
#if
#printenv
作用：
显示当前存在于WEB服务器环境中的所有环境变量。
语法：<!--#printenv-->
参数：无
示例：
<!--#printenv-->
#set
作用：可给变量赋值，以用于后面的if语句。
语法：<!--#set var=”变量名”value=”变量值”-->
参数：无
示例：
<!--#set var=”color”value=”红色”-->
#if
作用：
创建可以改变数据的页面，这些数据根据使用if语句时计算的要求予以显示。
语法：
<!--#if expr=”$变量名=\”变量值A\””-->
显示内容
<!--#elif expr=”$变量名=\”变量值B\””-->
显示内容
<!--#else-->
显示内容
<!--#endif”-->
参数：
关于XSSI的条件表达式
表达式
作用
(string)
如果string存在，就返回真
string1=string2
如果两个字符串相等，就返回真
string1!=string2
如果两个字符串不等，就返回真
string1<string2
如果string1小于string2，就返回真
string1<=string2
如果string1小于等于string2，就返回真
string1>string2
如果string1大于string2，就返回真
string1>=string2
如果string1大于等于string2，就返回真
!string
！为”非”操作符；若string存在，就返回真
(string1)&&(string2)
&&为”与”操作符；string1、string2都存在，就返回真
(string1)!!(string2)
!! 为”或”操作符；string1、string2有一个存在，就返回真
示例：
<!--#if expr=”$SERVER_NAME=\”hoyi.zb169.net\””-->
欢迎光临好易CGI工厂在淄博热线的分站http://hoyi.zb169.net。
<!--#elif expr=”$SERVER_NAME=\”linux.cqi.com.cn\”” -->
欢迎光临好易CGI工厂在太阳城的分站http://linux.cqi.com.cn/~hoyi。
<!--#else-->
欢迎光临好易CGI工厂！
<!--#endif”-->
注意：
用于前面指令中的反斜杠，是用来代换内部的引号，以便它们不会被解释为结束表达式。不可省略
|
|
大陆版本
1.大陆青春版
李逍遥:陈坤
赵灵儿:董洁
林月如:李冰冰
阿奴:高圆圆
拜月教主:王学兵
点评:应该都是国内的偶像精英
2.大陆成年版
李逍遥:黄磊
赵灵儿:蒋勤勤
林月如:陶虹(小)
阿奴:许晴
拜月教主:胡兵
点评:乱七八糟大集合
3.大陆中年版
李逍遥:张国立
赵灵儿:邓婕
林月如:刘晓庆
阿奴:宁静
拜月教主:王刚(和申版拜月)
剑圣:张铁林(又是铁三角)
点评:嘿嘿~中国的实力派明星
4.冯小刚版
李逍遥:葛优
赵灵儿:刘蓓
林月如:徐帆
阿奴:吕丽萍
拜月教主:傅彪
点评:葛优版仙剑肯定好看~哈哈
5.张艺谋版
李逍遥:李连杰
赵灵儿:巩俐
林月如:章子怡
阿奴:董洁
拜月教主:陈道明
点评:奥斯卡的阵容不是我们能够理解的
6.找骂版
李逍遥:李亚鹏
赵灵儿:章子怡
林月如:赵薇
阿奴:李湘
拜月教主:周杰
点评:这个版本的仙剑要是不被骂我去自杀
7.小品版
李逍遥:赵本山
赵灵儿:蔡明
林月如:宋丹丹
阿奴:高秀敏
拜月教主:范伟
点评:春节晚会小品<仙剑奇侠传>
8.央视主持人版
李逍遥:李咏
赵灵儿:周涛
林月如:倪萍
阿奴:王小丫
拜月教主:赵忠祥
点评:这个版本绝对让你参与到里面来,还有煽情和怪物讲解
台湾版本
1.台湾青春版
李逍遥:霍建华
赵灵儿:大S
林月如:林心如
阿奴:杨丞琳
拜月教主:言承旭
点评:嘿嘿~~算是出名的偶像了吧
2.台湾成人版
李逍遥:苏有朋
赵灵儿:林志玲
林月如:贾靖雯
阿奴:萧蔷
拜月教主:任贤齐
点评:这个版本估计有不小的吸引力
3.台湾娱乐版
李逍遥:吴宗宪
赵灵儿:柳瀚雅(阿雅)
林月如:徐熙娣
阿奴:陶晶莹
拜月教主:NONO
点评:完全是仙剑的<我猜>版本
4.台湾人气版
李逍遥:周杰伦
赵灵儿:蔡依琳
林月如:张韶涵
阿奴:S/H/E(任意)
拜月讨?王力宏
点评:完全是歌唱版的,没有对白,李逍遥唱的可能听不清
香港版本
1.香港经典版
李逍遥:古天乐
赵灵儿:李若彤
林月如:宣萱
阿奴:蔡少芬
拜月教主:黄日华
点评:这个版本要是早十年出来就OK了,可惜...
2.香港****版
李逍遥:任达华
赵灵儿:叶玉卿
林月如:舒琪
阿奴:邱淑贞
拜月教主:徐锦江(无语)
点评:你喜欢****片吗?来看这部吧!包你爽~~
3.周星驰版
李逍遥:周星驰
赵灵儿:张柏芝
林月如:莫文蔚
阿奴:黄圣依
拜月教主:吴孟达
点评:这个版本要是出来你看吗?呵呵~~~
4.刘德华版
李逍遥:刘德华
赵灵儿:关芝琳
林月如:郑秀文
阿奴:刘若英
拜月教主:梁朝伟
点评:这个阵容的金马奖绝对没问题
5.香港偶像版(大唐双龙版)
李逍遥:林峰/吴卓羲
赵灵儿:唐林
林月如:杨怡
阿奴:胡定欣
拜月教主:李子雄
点评:记得大唐双龙传吗?
6.绝世经典版
李逍遥:郑少秋
赵灵儿:赵雅芝
林月如:林青侠
阿奴:张曼玉
拜月教主:周润发
点评:如果连这个阵容你都不觉得豪华,那你的要求也太高了吧
7.香港搞笑版
李逍遥:曾志伟
赵灵儿:沈殿霞
林月如:吴君如
阿奴:毛舜筠
拜月教主:王晶
点评:王晶搞笑贺岁片
海外版本
1.韩国版(1)
李逍遥:元彬
赵灵儿:宋慧桥
林月如:全知贤
阿奴:张娜拉
拜月教主:安在旭
点评:这个版本会让你眼泪留干,男人更加心痛,女人更加疯狂
2.韩国版(2)
李逍遥:裴勇俊
赵灵儿:金喜善
林月如:崔智友
阿奴:金南珠
拜月教主:张东健
点评:这个版本估计没什么武打戏份,都是言情,估计有100多集
3.日本(激情)版
李逍遥:木村拓哉
赵灵儿:深田恭子
林月如:藤原纪香
阿奴:松浦亚弥
拜月教主:反町隆史
点评:帅哥加美女,如果有女优就更好
4.欧美版
李逍遥:汤姆·克鲁斯
赵灵儿:凯瑟琳·泽塔琼斯
林月如:卡梅隆·迪亚兹
阿奴:妮可·基德曼
拜月教主:金·凯瑞
点评:奥斯卡阵容,注意!这个拜月很搞笑
5.世界政治版
李逍遥:布什
赵灵儿:布莱尔(反串)
林月如:小泉纯一郎(反串)
阿奴:沙龙(反串)
拜月教主:本·拉登
水灵兽:萨达姆
点评:水灵兽已经被干掉了,而拜月教主躲在阿富汗!
|
示例代码如下：
<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="MyDataList.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:DataList id="MyDataList" style="Z-INDEX: 101; LEFT: 16px; POSITION: absolute; TOP: 32px"
runat="server" RepeatColumns="1" RepeatDirection="Horizontal">
<ItemTemplate>
<asp:Label onmouseover="this.style.backgroundColor='Silver'" onmouseout="this.style.backgroundColor='white'" Text="<%#Container.DataItem%>" Runat=server>
</asp:Label><br>
</ItemTemplate>
<SelectedItemStyle BackColor="#66cccc"></SelectedItemStyle>
</asp:DataList>
</form>
</body>
</HTML>
|
private void MyDataList_ItemDataBound(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
{
if (e.Item.ItemIndex >= 0)
{
e.Item.Attributes["onMouseOver"] = "javascript:this.bgColor='#C6D7E7';";
e.Item.Attributes["onMouseOut"] = "javascript:this.bgColor='#ffffff';";
}
}
|
重点在于把datalist所要绑定的文本转化为其他控件的文本再在控件中添加脚本。
|
|
|
|
|
