Dhtml网页实例教程（5）
来源：动态WEB脚本技术论坛 时间：2007-10-09 13:39:00
Dhtml实例教程（五）
例7 CSS样式单与JavaScript相结合改变文本
<html>
<head>
<title>DHtml举例7</title>
<style><!--
.red {color:red}
.blue {color:blue}
-->
</style>
<script language="JavaScript">
function change_text(){
if(window.event.srcElement.className=="red"){
window.event.srcElement.className="blue";
}
else
{
window.event.srcElement.className="red";
}
}
</script>
</head>
<body>
<br>
<h3 class="red" align="center" onmouseover="change_text()" onmouseout="change_text()">我是变色龙！</h3>
<h3 class="blue" align="center" onmouseover="change_text()" onmouseout="change_text()">我是变色鸟！</h3>
<h3 class="red" align="center" onmouseover="change_text()" onmouseout="change_text()">我是变色兔！</h3>
</body>
</html>
从例7中可以看到，我在CSS样式单中定义了red和blue两个样式类，然后在change_text()函数中对调用该函数的对象进行样式类的改变，从而达到颜色的变换，关键语句在于window.event.srcElement.className="样式类名"，此语句能使当前调用函数的对象的className属性改变，若class="red"，当调用change_text()函数时，其className="blue"，它的样式类也就变成了“blue”。
也许您会因为要对每一行文本增加onmouseover和onmouseout事件而觉得麻烦，不要紧，我马上来搞定这个麻烦问题。请期待明天的连载。
标签：html,dhtml,教程
0
投稿猜你喜欢
详解Python下ftp上传文件linux服务器
2023-12-31 19:02:37
关于ASP eof与bof 区别分析
2011-03-11 11:14:00
ASP读取ini文件
2010-01-20 11:17:00
python 实现倒计时功能(gui界面)
2021-03-05 14:19:55
利用Python脚本写端口扫描器socket,python-nmap
2021-05-10 15:16:54
MS SQL 查询数据在数据库中所在行
2009-04-26 19:36:00
显示ASP页面源码的代码
2008-10-12 13:05:00
页面中 CSS 加载方式的优化
2008-03-26 12:36:00
利用 Python 把小伙伴制作成表情包
2022-08-14 16:57:46
修改python plot折线图的坐标轴刻度方法
2021-06-24 09:09:43
Python Pygame实战之超级炸弹人游戏的实现
2023-07-24 00:56:11
ASP中正则表达式的应用
2010-05-27 12:24:00
Python爬虫框架Scrapy常用命令总结
2022-02-21 20:45:23
SqlServer 2005 T-SQL Query 学习笔记（2）
2024-01-20 20:21:51
golang组件swagger生成接口文档实践示例
2023-09-19 11:29:39
Python面向对象的三大特性封装、继承、多态
2023-12-11 05:15:52
MYSQL的存储过程和函数简单写法
2024-01-21 20:16:34
Python数据结构之栈详解
2021-01-07 01:12:36
无序列表 li ul
2008-07-29 13:00:00
javascript新闻图片轮换类
2009-01-09 12:57:00