使用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 函数式编程
Aug 16 Javascript
ExtJS 简介 让你知道extjs是什么
Dec 29 Javascript
JavaScript 私有成员分析
Jan 13 Javascript
jquery 应用代码 方便的排序功能
Feb 06 Javascript
JS 跳转页面延迟2种方法
Mar 29 Javascript
javascript Event对象详解及使用示例
Nov 22 Javascript
一个JavaScript用逗号分割字符串实例
Sep 22 Javascript
简单实现jQuery弹幕效果
May 06 jQuery
Vue的transition-group与Virtual Dom Diff算法的使用
Dec 09 Javascript
js表达式与运算符简单操作示例
Feb 15 Javascript
JS实现进度条动态加载特效
Mar 25 Javascript
一起来看看Vue的核心原理剖析
Mar 24 Vue.js
使用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中通过smtp发邮件的类,测试通过
2007/01/22 PHP
Laravel中基于Artisan View扩展包创建及删除应用视图文件的方法
2016/10/08 PHP
jQuery 改变CSS样式基础代码
2010/02/11 Javascript
取得窗口大小 兼容所有浏览器的js代码
2011/08/09 Javascript
使用JS 清空File控件的路径值
2013/07/08 Javascript
javascript获取web应用根目录的方法
2014/02/12 Javascript
jquery解决客户端跨域访问问题
2015/01/06 Javascript
jQuery实现信息提示框(带有圆角框与动画)效果
2015/08/07 Javascript
浅谈Node.js:fs文件系统模块
2016/12/08 Javascript
vue.js事件处理器是什么
2017/03/20 Javascript
jQuery实现的简单无刷新评论功能示例
2017/11/08 jQuery
JavaScript学习笔记之图片库案例分析
2019/01/08 Javascript
vue 表单之通过v-model绑定单选按钮radio
2019/05/13 Javascript
vue data引入本地图片的两种方式小结
2019/11/13 Javascript
jQuery实现王者荣耀手风琴效果
2020/01/17 jQuery
Python实现生成简单的Makefile文件代码示例
2015/03/10 Python
Python中的下划线详解
2015/06/24 Python
机器学习10大经典算法详解
2017/12/07 Python
Python-OpenCV基本操作方法详解
2018/04/02 Python
python实现多进程代码示例
2018/10/31 Python
对python中字典keys,values,items的使用详解
2019/02/03 Python
Django框架教程之中间件MiddleWare浅析
2019/12/29 Python
python修改linux中文件(文件夹)的权限属性操作
2020/03/05 Python
python 基于opencv 实现一个鼠标绘图小程序
2020/12/11 Python
python switch 实现多分支选择功能
2020/12/21 Python
基于HTML5新特性Mutation Observer实现编辑器的撤销和回退操作
2016/01/11 HTML / CSS
美国折衷生活方式品牌:Robert Graham
2018/07/13 全球购物
专业毕业生个性的自我评价
2013/10/03 职场文书
新郎新娘婚礼答谢词
2014/01/11 职场文书
洗车工岗位职责
2014/03/15 职场文书
电气工程及其自动化专业毕业生自荐信
2014/06/21 职场文书
运动会广播稿100字
2014/09/14 职场文书
美容院管理规章制度
2015/08/05 职场文书
60条职场经典语录,总有一条能触动你的心
2019/08/21 职场文书
用几道面试题来看JavaScript执行机制
2021/04/30 Javascript
十大好看的穿越动漫排名:《瑞克和莫蒂》第一,国漫《有药》在榜
2022/03/18 日漫