为指定元素增加样式的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调用后台的三种方法实例
Oct 17 Javascript
js创建表单元素并使用submit进行提交
Aug 14 Javascript
jQuery中get()方法用法实例
Dec 27 Javascript
JS数组合并push与concat区别分析
Dec 17 Javascript
再谈javascript注入 黑客必备!
Sep 14 Javascript
基于js实现checkbox批量选中操作
Nov 22 Javascript
javaScript 逻辑运算符使用技巧整理
May 03 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
Oct 17 Javascript
VUE 全局变量的几种实现方式
Aug 22 Javascript
在React项目中使用Eslint代码检查工具及常见问题
Oct 10 Javascript
解决eclipse中没有js代码提示的问题
Oct 10 Javascript
Vue+Element自定义纵向表格表头教程
Oct 26 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
espresso double下 咖啡粉超细时 饼压力对咖啡的影响
2021/03/03 冲泡冲煮
PHP冒泡排序算法代码详细解读
2011/07/17 PHP
ThinkPHP3.1新特性之多层MVC的支持
2014/06/19 PHP
浅析PHP开发规范
2018/02/05 PHP
PHP基于进程控制函数实现多线程
2020/12/09 PHP
JavaScript中奇葩的假值示例应用
2014/03/11 Javascript
实例讲解JS中数组Array的操作方法
2014/05/09 Javascript
使用Javascript简单实现图片无缝滚动
2014/12/05 Javascript
JavaScript中var关键字的使用详解
2015/08/14 Javascript
ES6新特性二:Iterator(遍历器)和for-of循环详解
2017/04/20 Javascript
利用js编写网页进度条效果
2017/10/08 Javascript
使用vue实现grid-layout功能实例代码
2018/01/05 Javascript
浅谈Webpack 持久化缓存实践
2018/03/22 Javascript
vue 组件中添加样式不生效的解决方法
2018/07/06 Javascript
解决vue 项目引入字体图标报错、不显示等问题
2018/09/01 Javascript
vue+springboot实现项目的CORS跨域请求
2018/09/05 Javascript
vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)
2019/05/10 Javascript
[02:49]2018DOTA2亚洲邀请赛主赛事决赛日战况回顾 Mineski鏖战5局夺得辉耀
2018/04/10 DOTA
使用python编写脚本获取手机当前应用apk的信息
2014/07/21 Python
python实现扫描日志关键字的示例
2018/04/28 Python
python绘制热力图heatmap
2020/03/23 Python
Python Matplotlib库安装与基本作图示例
2019/01/09 Python
pandas ix &amp;iloc &amp;loc的区别
2019/01/10 Python
Python使用Excel将数据写入多个sheet
2020/05/16 Python
Django Admin 上传文件到七牛云的示例代码
2020/06/20 Python
浅谈Python __init__.py的作用
2020/10/28 Python
20佳惊艳的HTML5应用程序示例分享
2011/05/03 HTML / CSS
Dyson戴森波兰官网:Dyson.pl
2019/08/05 全球购物
金融管理应届生求职信
2014/02/20 职场文书
人事任命书怎么写
2014/06/05 职场文书
党员教师个人对照检查材料(群众路线)
2014/09/26 职场文书
拔河比赛新闻稿
2015/07/17 职场文书
2019财务转正述职报告
2019/06/27 职场文书
MySQL令人大跌眼镜的隐式转换
2021/08/23 MySQL
CSS 一行代码实现头像与国旗的融合
2021/10/24 HTML / CSS
JavaScript 事件捕获冒泡与捕获详情
2021/11/11 Javascript