使用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 静态页面实现随机显示广告的办法
Nov 17 Javascript
jQuery 中使用JSON的实现代码
Dec 01 Javascript
js动态在form上插入enctype=multipart/form-data的问题
May 24 Javascript
使用jQuery Ajax功能时需要注意的一个问题(内存溢出)
May 30 Javascript
jQuery 全选/反选以及单击行改变背景色实例
Jul 02 Javascript
Javascript倒计时页面跳转实例小结
Sep 11 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
Dec 05 Javascript
jQuery实现复选框成对选择及对应取消的方法
Mar 03 Javascript
CSS+JS实现点击文字弹出定时自动关闭DIV层菜单的方法
May 12 Javascript
jQuery回到顶部的代码
Jul 09 Javascript
vue select二级联动第二级默认选中第一个option值的实例
Jan 10 Javascript
jQuery实现参数自定义的文字跑马灯效果
Aug 15 jQuery
使用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中利用sleep函数实现定时执行功能实现代码
2016/08/25 PHP
浅谈htmlentities 、htmlspecialchars、addslashes的使用方法
2016/12/09 PHP
JavaScript之HTMLCollection接口代码
2011/04/27 Javascript
省市区三级联动jquery实现代码
2020/04/15 Javascript
jquery select2的使用心得(推荐)
2016/12/04 Javascript
JS实现全屏的四种写法
2016/12/30 Javascript
js实现3D图片展示效果
2017/03/09 Javascript
vue 2.0封装model组件的方法
2017/08/03 Javascript
详解让sublime text3支持Vue语法高亮显示的示例
2017/09/29 Javascript
详解vue + vuex + directives实现权限按钮的思路
2017/10/24 Javascript
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
JavaScript解析及序列化JSON的方法实例分析
2019/01/04 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
2019/04/10 Javascript
微信小程序 组件的外部样式externalClasses使用详解
2019/09/06 Javascript
vue+element table表格实现动态列筛选的示例代码
2021/01/14 Vue.js
[54:10]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
python通过exifread模块获得图片exif信息的方法
2015/03/16 Python
Python实现matplotlib显示中文的方法详解
2018/02/06 Python
Python 实现顺序高斯消元法示例
2019/12/09 Python
如何基于python实现脚本加密
2019/12/28 Python
Python 自由定制表格的实现示例
2020/03/20 Python
Keras 加载已经训练好的模型进行预测操作
2020/06/17 Python
python3 中使用urllib问题以及urllib详解
2020/08/03 Python
欧缇丽美国官网:Caudalie美国
2016/12/31 全球购物
森海塞尔美国官网:Sennheiser耳机与耳麦
2017/07/19 全球购物
如何提高JDBC的性能
2013/04/30 面试题
大学生的四年学习自我评价
2013/12/13 职场文书
媒矿安全生产承诺书
2014/05/23 职场文书
分公司任命书
2014/06/06 职场文书
图书室标语
2014/06/21 职场文书
房租涨价通知
2015/04/23 职场文书
2015年大学迎新晚会总结
2015/07/16 职场文书
小学班主任研修日志
2015/11/13 职场文书
带你彻底理解JavaScript中的原型对象
2021/04/14 Javascript
Java服务调用RestTemplate与HttpClient的使用详解
2022/06/21 Java/Android
python数字图像处理:图像简单滤波
2022/06/28 Python