使用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 相关文章推荐
showModelessDialog()使用详解
Sep 07 Javascript
利用JS自动打开页面上链接的实现代码
Sep 25 Javascript
Jquery.addClass始终无效原因分析
Sep 08 Javascript
jquery单行文字向上滚动效果示例
Mar 06 Javascript
3种js实现string的substring方法
Nov 09 Javascript
KnockoutJS 3.X API 第四章之表单textInput、hasFocus、checked绑定
Oct 11 Javascript
JS中闭包的经典用法小结(2则示例)
Dec 28 Javascript
通过js修改input、select默认字体颜色
Apr 19 Javascript
vue-cli单页应用改成多页应用配置详解
Jul 14 Javascript
jQuery进阶实践之利用最优雅的方式如何写ajax请求
Dec 20 jQuery
Webpack框架核心概念(知识点整理)
Dec 22 Javascript
antd Select下拉菜单动态添加option里的内容操作
Nov 02 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
mysql中存储过程、函数的一些问题
2007/02/14 PHP
php 修改zen-cart下单和付款流程以防止漏单
2010/03/08 PHP
更改localhost为其他名字的方法
2014/02/10 PHP
功能强大的php分页函数
2016/07/20 PHP
手把手编写PHP框架 深入了解MVC运行流程
2016/09/19 PHP
fckeditor 获取文本框值的实现代码
2009/02/09 Javascript
jQuery判断div随滚动条滚动到一定位置后停止
2014/04/02 Javascript
JavaScript常用的弹出广告及背投广告实现方法
2015/02/06 Javascript
论JavaScript模块化编程
2016/03/07 Javascript
前端面试知识点锦集(JavaScript篇)
2016/12/28 Javascript
webpack开发跨域问题解决办法
2017/08/03 Javascript
javascript实现循环广告条效果
2017/12/12 Javascript
Angular4.0中引入laydate.js日期插件的方法教程
2017/12/25 Javascript
layui 监听表格复选框选中值的方法
2018/08/15 Javascript
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
在vue和element-ui的table中实现分页复选功能
2019/12/04 Javascript
在项目vue中使用echarts的操作步骤
2020/09/07 Javascript
python实现从web抓取文档的方法
2014/09/26 Python
python遍历 truple list dictionary的几种方法总结
2016/09/11 Python
使用python装饰器计算函数运行时间的实例
2018/04/21 Python
python 计算一个字符串中所有数字的和实例
2019/06/11 Python
pandas实现DataFrame显示最大行列,不省略显示实例
2019/12/26 Python
解决pycharm每次打开项目都需要配置解释器和安装库问题
2020/02/26 Python
Python模块相关知识点小结
2020/03/09 Python
在Ubuntu 20.04中安装Pycharm 2020.1的图文教程
2020/04/30 Python
安装pyinstaller遇到的各种问题(小结)
2020/11/20 Python
名人珠宝设计师:Melinda Maria Jewelry
2019/03/06 全球购物
Notino芬兰:购买香水和化妆品
2019/04/15 全球购物
Nicole Miller官方网站:纽约女装品牌
2019/09/14 全球购物
本科应届生自荐信
2014/06/29 职场文书
2014应届本科生自我评价
2014/09/13 职场文书
借款协议书
2014/09/16 职场文书
2014业务员年终工作总结
2014/12/09 职场文书
报名委托书
2015/01/29 职场文书
剑指Offer之Java算法习题精讲二叉树的构造和遍历
2022/03/21 Java/Android
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
2022/04/06 Vue.js