使用JavaScript动态设置样式实现代码(2)


Posted in Javascript onJanuary 25, 2013

你可以参考到前一版本 https://3water.com/article/33555.htm 这个有点不好的地方,就是如果想改变样式,也许得使用查找替换才行。

因此,Insus.NET写出另外一个方法来实现,这样可以改一应用百。
先写一个样式Style:

<style type="text/css"> 
.overStyle 
{ 
border-color:#3599ff; 
} 
.outStyle 
{ 
border-color: #fff; 
} 
</style>

Javascript也要改一下:
<script type="text/javascript"> 
function onOver(Id) { 
Id.className = 'overStyle'; 
} 
function onOut(Id) { 
Id.className = 'outStyle'; 
} 
</script>

最后是html的动态应用。
<fieldset id="fs1" style="margin: 10px; padding: 10px; width: 170px; text-align: center;" 
onmouseover="onOver(this)" onmouseout="onOut(this)"> 
ERP <a href="http://xxx.xxx.com/erp" target="_blank">http://xxx.xxx.com/erp </a> 
</fieldset>
Javascript 相关文章推荐
用jQuery实现检测浏览器及版本的脚本代码
Jan 22 Javascript
JS中不为人知的五种声明Number的方式简要概述
Feb 22 Javascript
实例讲解JS中数组Array的操作方法
May 09 Javascript
javascript基于prototype实现类似OOP继承的方法
Dec 16 Javascript
Jquery实现的简单轮播效果【附实例】
Apr 19 Javascript
jQuery制作图片旋转效果
Feb 02 Javascript
canvas 绘制圆形时钟
Feb 22 Javascript
详解Vue2.x-directive的学习笔记
Jul 17 Javascript
Vue2.0 多 Tab切换组件的封装实例
Jul 28 Javascript
angularjs 页面自适应高度的方法
Jan 17 Javascript
jquery获取元素到屏幕四周可视距离的方法
Sep 05 jQuery
vue.js中proxyTable 转发请求的实现方法
Sep 20 Javascript
使用JavaScript动态设置样式实现代码及演示动画
Jan 25 #Javascript
jQuery获取Select选择的Text和Value(详细汇总)
Jan 25 #Javascript
javascript面向对象包装类Class封装类库剖析
Jan 24 #Javascript
js iframe跨域访问(同主域/非同主域)分别深入介绍
Jan 24 #Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 #Javascript
ajax处理php返回json数据的实例代码
Jan 24 #Javascript
一个级联菜单代码学习及removeClass与addClass的应用
Jan 24 #Javascript
You might like
php实现读取手机客户端浏览器的类
2015/01/09 PHP
PHP preg_match实现正则表达式匹配功能【输出是否匹配及匹配值】
2017/07/19 PHP
仿迅雷焦点广告效果(JQuery版)
2008/11/19 Javascript
图片img的src不变让浏览器重新加载实现方法
2013/03/29 Javascript
js写出遮罩层登陆框和对联广告并自动跟随滚动条滚动
2014/04/29 Javascript
jquery实现聚光灯效果的方法
2015/02/06 Javascript
jQuery检测滚动条是否到达底部
2015/12/15 Javascript
jQuery给div,Span, a ,button, radio 赋值与取值
2016/06/24 Javascript
node.js实现登录注册页面
2017/04/08 Javascript
javascript实现Java中的Map对象功能的实例详解
2017/08/21 Javascript
nodejs实现套接字服务功能详解
2018/06/21 NodeJs
vue+express+jwt持久化登录的方法
2019/06/14 Javascript
node中使用log4js4.x版本记录日志的方法
2019/08/20 Javascript
Vue开发环境跨域访问问题
2020/01/22 Javascript
JS实现网页端猜数字小游戏
2020/03/06 Javascript
在vue中使用Base64转码的案例
2020/08/07 Javascript
pyqt4教程之实现半透明的天气预报界面示例
2014/03/02 Python
Python中os.path用法分析
2015/01/15 Python
python实现图片转字符小工具
2019/04/30 Python
使用 Django Highcharts 实现数据可视化过程解析
2019/07/31 Python
Python:slice与indices的用法
2019/11/25 Python
如何用OpenCV -python3实现视频物体追踪
2019/12/04 Python
Python参数传递机制传值和传引用原理详解
2020/05/22 Python
基于django2.2连oracle11g解决版本冲突的问题
2020/07/02 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
html5默认气泡修改的代码详解
2020/03/13 HTML / CSS
英国首屈一指的票务公司:See Tickets
2019/05/11 全球购物
介绍一下Java中的Class类
2015/04/10 面试题
三维科技面试题
2013/07/27 面试题
党风廉政建设责任书
2014/04/14 职场文书
软件专业毕业生个人自我鉴定
2014/04/17 职场文书
大学生求职信
2014/06/17 职场文书
党员一帮一活动总结
2014/07/08 职场文书
2015年七夕爱情寄语
2015/03/24 职场文书
导游词之西递宏村
2019/12/10 职场文书
python面向对象版学生信息管理系统
2021/06/24 Python