为指定元素增加样式的js代码


Posted in Javascript onDecember 09, 2009

这个函数主要是为指定的元素添加样式。相当于Jquery中的addClass(class)--为每个匹配的元素添加指定的类名。

在Jquery中要求 class (String) : 一个或多个要添加到元素中的CSS类名,请用空格分开。而这个函数也是有这样的要求。

div{ border:1px solid #ccc; width:200px; height:200px;} 
.a{ background:#900; } 
.b{ font-size:30px; font-weight:bold;}
function addClass(elements, value) 
{ 
if (!elements.className) { 
elements.className = value; 
} 
else 
{ 
newClass = elements.className; 
newClass += " "; 
newClass += value; 
elements.className = newClass; 
} 
} 
window.onload = function () 
{ 
var test = document.getElementById('test'); 
alert(test.className); 
addClass(test, 'a b'); 
//addClass(test, 'b'); 
}

<div id="test">这里是测试层</div>

Javascript 相关文章推荐
js中arguments的用法(实例讲解)
Nov 30 Javascript
如何实现textarea里的不同文本显示不同颜色
Jan 20 Javascript
JS 删除字符串最后一个字符的实现代码
Feb 20 Javascript
jquery easyui使用心得
Jul 07 Javascript
兼容最新firefox、chrome和IE的javascript图片预览实现代码
Aug 08 Javascript
jQuery中change事件用法实例
Dec 26 Javascript
Extjs 点击复选框在表格中增加相关信息行
Jul 12 Javascript
BootStrap组件之进度条的基本用法
Jan 19 Javascript
vue-quill-editor实现图片上传功能
Aug 08 Javascript
浅谈vue后台管理系统权限控制思考与实践
Dec 19 Javascript
echarts.js 动态生成多个图表 使用vue封装组件操作
Jul 19 Javascript
keep-alive保持组件状态的方法
Dec 02 Javascript
javascript setTimeout和setInterval 的区别
Dec 08 #Javascript
javascript OFFICE控件测试代码
Dec 08 #Javascript
JavaScript Cookie 直接浏览网站分网址
Dec 08 #Javascript
JavaScript Cookie显示用户上次访问的时间和次数
Dec 08 #Javascript
JavaScript 利用Cookie记录用户登录信息
Dec 08 #Javascript
JavaScript Cookie的读取和写入函数
Dec 08 #Javascript
jquery 双色表格实现代码
Dec 08 #Javascript
You might like
gd库图片下载类实现下载网页所有图片的php代码
2012/08/20 PHP
PHP使用array_multisort对多个数组或多维数组进行排序
2014/12/16 PHP
PHP实现非阻塞模式的方法分析
2018/07/26 PHP
php中的buffer缓冲区用法分析
2019/05/31 PHP
宝塔面板在NGINX环境中TP5.1如何运行?
2021/03/09 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
jqPlot 基于jquery的画图插件
2011/04/26 Javascript
Javascript小技巧之生成html元素
2014/05/15 Javascript
Javascript验证用户输入URL地址是否为空及格式是否正确
2014/10/09 Javascript
举例讲解JavaScript substring()的使用方法
2015/11/09 Javascript
原生js页面滚动延迟加载图片
2015/12/20 Javascript
原生js实现放大镜效果
2017/01/11 Javascript
zTree异步加载展开第一级节点的实现方法
2017/09/05 Javascript
详解使用PM2管理nodejs进程
2017/10/24 NodeJs
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
在vue项目中使用md5加密的方法
2018/09/14 Javascript
eslint 的三大通用规则详解
2019/05/16 Javascript
JavaScript基础之this和箭头函数详析
2019/09/05 Javascript
这15个Vue指令,让你的项目开发爽到爆
2019/10/11 Javascript
vue 解决addRoutes多次添加路由重复的操作
2020/08/04 Javascript
聊聊vue 中的v-on参数问题
2021/01/29 Vue.js
Python中easy_install 和 pip 的安装及使用
2017/06/05 Python
Python编程在flask中模拟进行Restful的CRUD操作
2018/12/28 Python
python实现两张图片的像素融合
2019/02/23 Python
django如何自己创建一个中间件
2019/07/24 Python
python实现获取单向链表倒数第k个结点的值示例
2019/10/24 Python
python+pygame实现坦克大战小游戏的示例代码(可以自定义子弹速度)
2020/08/11 Python
css3动画效果抖动解决方法
2018/09/03 HTML / CSS
稀有和绝版书籍:Biblio.com
2017/02/02 全球购物
个人求职简历中英文自我评价
2013/12/16 职场文书
期末个人总结范文
2015/02/13 职场文书
2015年高考寄语或鼓励的话
2015/03/23 职场文书
销售督导岗位职责
2015/04/10 职场文书
html实现弹窗的实例
2021/06/09 HTML / CSS
图解排序算法之希尔排序Java实现
2021/06/26 Java/Android
Java8 Stream API 提供了一种高效且易于使用的处理数据的方式
2022/04/13 Java/Android