为指定元素增加样式的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 相关文章推荐
javascript cookie操作类的实现代码小结附使用方法
Jun 02 Javascript
IE6中链接A的href为javascript协议时不在当前页面跳转
Jun 05 Javascript
浅谈JavaScript的内置对象和浏览器对象
Jun 03 Javascript
jQuery调用Webservice传递json数组的方法
Aug 06 Javascript
用AngularJS的指令实现tabs切换效果
Aug 31 Javascript
Vue.js每天必学之过渡与动画
Sep 06 Javascript
Angularjs中使用轮播图指令swiper
May 30 Javascript
JavaScript之浏览器对象_动力节点Java学院整理
Jul 03 Javascript
js HTML5 canvas绘制图片的方法
Sep 08 Javascript
React Native预设占位placeholder的使用
Sep 28 Javascript
Angularjs中date过滤器失效的问题及解决方法
Jul 06 Javascript
微信小程序 checkbox使用实例解析
Sep 09 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
PHP编程与应用
2006/10/09 PHP
如何在PHP中使用Oracle数据库(1)
2006/10/09 PHP
php基础知识:控制结构
2006/12/13 PHP
Zend Guard一些常见问题解答
2008/09/11 PHP
php实现文件下载更能介绍
2012/11/23 PHP
php实现猴子选大王问题算法实例
2015/04/20 PHP
PHP使用trim函数去除字符串左右空格及特殊字符实例
2016/01/07 PHP
PHP简单实现合并2个数字键数组值的方法
2017/05/30 PHP
Yii2框架自定义验证规则操作示例
2019/02/08 PHP
PHP进阶学习之类的自动加载机制原理分析
2019/06/18 PHP
laravel框架创建授权策略实例分析
2019/11/22 PHP
JS中confirm,alert,prompt函数使用区别分析
2010/04/01 Javascript
实现变速回到顶部的JavaScript代码
2011/05/09 Javascript
JQUERY1.6 使用方法四 检测浏览器
2011/11/23 Javascript
JS子父窗口互相操作取值赋值的方法介绍
2013/05/11 Javascript
如何获取网站icon有哪些可行的方法
2014/06/05 Javascript
js用Date对象的setDate()函数对日期进行加减操作
2014/09/18 Javascript
javascript实现根据身份证号读取相关信息
2014/12/17 Javascript
JS仿Windows开机启动Loading进度条的方法
2015/02/26 Javascript
浅析JavaScript 箭头函数 generator Date JSON
2016/05/23 Javascript
关于Vue.nextTick()的正确使用方法浅析
2017/08/25 Javascript
JS库之Three.js 简易入门教程(详解之一)
2017/09/13 Javascript
javaScript手机号码校验工具类PhoneUtils详解
2017/12/08 Javascript
微信小程序仿朋友圈发布动态功能
2018/07/15 Javascript
使用layui的layer组件做弹出层的例子
2019/09/27 Javascript
小程序实现tab标签页
2020/11/16 Javascript
[01:50]《我与DAC》之玩家:iG夺冠时的那面红旗
2018/03/29 DOTA
python利用sklearn包编写决策树源代码
2017/12/21 Python
Python 字符串与二进制串的相互转换示例
2018/07/23 Python
结合OpenCV与TensorFlow进行人脸识别的实现
2019/10/10 Python
Python 中使用 PyMySQL模块操作数据库的方法
2019/11/10 Python
Python闭包与装饰器原理及实例解析
2020/04/30 Python
公务员综合考察材料
2014/02/01 职场文书
小学优秀班主任材料
2014/12/17 职场文书
会议接待欢迎词范文
2015/01/26 职场文书
vue实现可以快进后退的跑马灯组件
2022/04/08 Vue.js