使用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 相关文章推荐
不懂JavaScript应该怎样学
Apr 16 Javascript
js中将URL中的参数提取出来作为对象的实现代码
Aug 16 Javascript
关于javascript function对象那些迷惑分析
Oct 24 Javascript
js 为label标签和div标签赋值的方法
Aug 08 Javascript
jquery.qrcode在线生成二维码使用示例
Aug 21 Javascript
jquery 隐藏与显示tr标签示例代码
Jun 06 Javascript
js使用正则实现ReplaceAll全部替换的方法
Aug 22 Javascript
jQuery实现响应鼠标事件的图片透明效果【附demo源码下载】
Jun 16 Javascript
使用JavaScript进行表单校验功能
Aug 01 Javascript
BootStrap 标题设置跨行无效的解决方法
Oct 25 Javascript
Typescript 中的 interface 和 type 到底有什么区别详解
Jun 18 Javascript
微信小程序实现侧边分类栏
Oct 21 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网页游戏学习之Xnova(ogame)源码解读(五)
2014/06/23 PHP
codeigniter显示所有脚本执行时间的方法
2015/03/21 PHP
用js生产批量批处理执行命令
2008/07/28 Javascript
JQuery实现简单验证码提示解决方案
2012/12/20 Javascript
使用jquery解析XML示例代码
2014/09/05 Javascript
浅析Node.js中的内存泄漏问题
2015/06/23 Javascript
jquery实现仿Flash的横向滑动菜单效果代码
2015/09/17 Javascript
javascript实现在网页中运行本地程序的方法
2016/02/03 Javascript
vue 虚拟dom的patch源码分析
2018/03/01 Javascript
Vue拖拽组件开发实例详解
2018/05/11 Javascript
ajaxfileupload.js实现上传文件功能
2019/04/19 Javascript
JavaScript实现身份证验证代码实例
2019/08/26 Javascript
layui button 按钮弹出提示窗口,确定才进行的方法
2019/09/06 Javascript
node 文件上传接口的转发的实现
2019/09/23 Javascript
在VUE中使用lodash的debounce和throttle操作
2020/11/09 Javascript
[56:41]iG vs Winstrike 2018国际邀请赛小组赛BO2 第二场
2018/08/17 DOTA
python爬取网站数据保存使用的方法
2013/11/20 Python
Python的另外几种语言实现
2015/01/29 Python
Python StringIO模块实现在内存缓冲区中读写数据
2015/04/08 Python
使用Python的Twisted框架构建非阻塞下载程序的实例教程
2016/05/25 Python
简单了解Python中的几种函数
2017/11/03 Python
Python类和对象的定义与实际应用案例分析
2018/12/27 Python
Python中出现IndentationError:unindent does not match any outer indentation level错误的解决方法
2020/04/18 Python
pandas factorize实现将字符串特征转化为数字特征
2019/12/19 Python
Python第三方库的几种安装方式(小结)
2020/04/03 Python
ansible-playbook实现自动部署KVM及安装python3的详细教程
2020/05/11 Python
使用Keras 实现查看model weights .h5 文件的内容
2020/06/09 Python
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
Opodo英国旅游网站:预订廉价航班、酒店和汽车租赁
2018/07/14 全球购物
你常见到的runtime exception
2016/09/05 面试题
索引覆盖(Index Covering)查询含义
2012/02/18 面试题
C#实现启动一个进程
2016/10/01 面试题
创建服务型党组织实施方案
2014/02/25 职场文书
网络管理专业求职信
2014/03/15 职场文书
使用Redis实现秒杀功能的简单方法
2021/05/08 Redis
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android