使用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 相关文章推荐
JS解密入门之凭直觉解
Jun 25 Javascript
Extjs ajax同步请求时post方式参数发送方式
Aug 05 Javascript
node.js中的console.time方法使用说明
Dec 09 Javascript
Javascript中this关键字的一些小知识
Mar 15 Javascript
jQuery学习心得总结(必看篇)
Jun 10 Javascript
详解Vue整合axios的实例代码
Jun 21 Javascript
基于vue.js快速搭建图书管理平台
Oct 29 Javascript
javaScript和jQuery自动加载简单代码实现方法
Nov 24 jQuery
解决VUE中document.body.scrollTop为0的问题
Sep 15 Javascript
微信小程序开发之tabbar图标和颜色的实现
Oct 17 Javascript
uploadify插件实现多个图片上传并预览
Sep 30 Javascript
浅谈vue 多个变量同时赋相同值互相影响
Aug 05 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
建立动态的WML站点(三)
2006/10/09 PHP
PHP数字格式化
2006/12/06 PHP
pdo中使用参数化查询sql
2011/08/11 PHP
php 不使用js实现页面跳转
2014/02/11 PHP
PHP中模拟处理HTTP PUT请求的例子
2014/07/22 PHP
详解PHP中的Traits
2015/07/29 PHP
php实现的微信红包算法分析(非官方)
2015/09/25 PHP
使用PHP实现下载CSS文件中的图片
2015/12/06 PHP
php模板引擎技术简单实现
2016/03/15 PHP
laravel中数据显示方法(默认值和下拉option默认选中)
2019/10/11 PHP
在线编辑器的实现原理(兼容IE和FireFox)
2007/03/09 Javascript
在页面上点击任一链接时触发一个事件的代码
2007/04/07 Javascript
javascript实现回到顶部特效
2015/05/06 Javascript
个人总结的一些JavaScript技巧、实用函数、简洁方法、编程细节
2015/06/10 Javascript
js实现温度计时间样式代码分享
2015/08/21 Javascript
JS获取文件大小方法小结
2015/12/08 Javascript
Vuex之理解Getters的用法实例
2017/04/19 Javascript
Bootstrap下拉菜单更改为悬停(hover)触发的方法
2017/05/24 Javascript
js 数组详细操作方法及解析合集
2018/06/01 Javascript
使用jQuery给Table动态增加行、清空table的方法
2018/09/05 jQuery
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
详解JavaScript实现动态的轮播图效果
2019/04/29 Javascript
详解如何写出一个利于扩展的vue路由配置
2019/05/16 Javascript
微信小程序登录对接Django后端实现JWT方式验证登录详解
2019/07/29 Javascript
JavaScript实现雪花飘落效果
2020/12/27 Javascript
Python类方法__init__和__del__构造、析构过程分析
2015/03/06 Python
MAC中PyCharm设置python3解释器
2017/12/15 Python
python通过zabbix api获取主机
2018/09/17 Python
Python3.5 处理文本txt,删除不需要的行方法
2018/12/10 Python
Windows10下 python3.7 安装 facenet的教程
2019/09/10 Python
python3.6环境下安装freetype库和基本使用方法(推荐)
2020/05/10 Python
英国、欧洲和全球租车服务:Avis英国
2016/08/29 全球购物
携程旅行网:中国领先的在线旅行服务公司
2017/02/17 全球购物
GAZMAN官网:澳大利亚领先的男装品牌
2019/12/19 全球购物
《大作家的小老师》教学反思
2014/04/16 职场文书
学习保证书100字
2015/02/26 职场文书