jQuery使用addClass()方法给元素添加多个class样式


Posted in Javascript onMarch 26, 2015

本文实例讲述了jQuery使用addClass()方法给元素添加多个class样式的方法。分享给大家供大家参考。具体如下:

jQuery通过addClass()方法给元素添加多个class,只需要在添加的class中用空格分开多个class既可

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
 $("button").click(function(){
  $("#div1").addClass("important blue");
 });
});
</script>
<style type="text/css">
.important
{
font-weight:bold;
font-size:xx-large;
}
.blue
{
color:blue;
}
</style>
</head>
<body>
<div id="div1">This is some text.</div>
<div id="div2">This is some text.</div>
<br>
<button>Add classes to first div element</button>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Jquery+CSS3实现一款简洁大气带滑动效果的弹出层
May 15 Javascript
javascript实现点击按钮让DIV层弹性移动的方法
Feb 24 Javascript
使用js实现的简单拖拽效果
Mar 18 Javascript
javascript事件冒泡实例分析
May 13 Javascript
javascript实现在下拉列表中显示多级树形菜单的方法
Aug 12 Javascript
jQuery实现的跨容器无缝拖动效果代码
Jun 21 Javascript
Node.js数据库操作之查询MySQL数据库(二)
Mar 04 Javascript
Vue插件写、用详解(附demo)
Mar 20 Javascript
详解如何优雅地在React项目中使用Redux
Dec 28 Javascript
详解JS函数防抖
Jun 05 Javascript
微信小程序对图片进行canvas压缩的方法示例详解
Nov 12 Javascript
JavaScript原型链中函数和对象的理解
Jun 16 Javascript
Jquery异步提交表单代码分享
Mar 26 #Javascript
jQuery使用toggleClass方法动态添加删除Class样式的方法
Mar 26 #Javascript
jQuery使用CSS()方法给指定元素同时设置多个样式
Mar 26 #Javascript
12306验证码破解思路分享
Mar 25 #Javascript
jQuery获得包含margin的outerWidth和outerHeight的方法
Mar 25 #Javascript
jQuery获得document和window对象宽度和高度的方法
Mar 25 #Javascript
jQuery设置指定网页元素宽度和高度的方法
Mar 25 #Javascript
You might like
php 连接mysql连接被重置的解决方法
2011/02/15 PHP
php 生成签名及验证签名详解
2016/10/26 PHP
php验证码生成器
2017/05/24 PHP
PHP htmlspecialchars() 函数实例代码及用法大全
2018/09/18 PHP
ThinkPHP5&amp;5.1框架关联模型分页操作示例
2019/08/03 PHP
Yii 框架使用数据库(databases)的方法示例
2020/05/19 PHP
js 判断上传文件大小及格式代码
2013/11/13 Javascript
window resize和scroll事件的基本优化思路
2014/04/29 Javascript
JavaScript中判断页面关闭、页面刷新的实现代码
2014/08/27 Javascript
深入探寻javascript定时器
2015/01/02 Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
2015/03/03 Javascript
jQuery Mobile页面返回不需要重新get
2016/04/26 Javascript
jQuery grep()方法详解及实例代码
2016/10/30 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
将angular-ui的分页组件封装成指令的方法详解
2017/05/10 Javascript
echarts学习笔记之箱线图的分析与绘制详解
2017/11/22 Javascript
JS实现多物体运动的方法详解
2018/01/23 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
2019/08/12 Javascript
小程序实现锚点滑动效果
2019/09/23 Javascript
加速vue组件渲染之性能优化
2020/04/09 Javascript
JavaScript 类的封装操作示例详解
2020/05/16 Javascript
jQuery cookie的公共方法封装和使用示例
2020/06/01 jQuery
Windows上使用Python增加或删除权限的方法
2018/04/24 Python
pytorch 调整某一维度数据顺序的方法
2018/12/08 Python
利用python实现简易版的贪吃蛇游戏(面向python小白)
2018/12/30 Python
在linux系统下安装python librtmp包的实现方法
2019/07/22 Python
Lancome兰蔻官方旗舰店:来自法国的世界知名美妆品牌
2018/06/14 全球购物
abstract class和interface有什么区别?
2012/01/03 面试题
计算机操作自荐信
2013/12/07 职场文书
《社戏》教学反思
2014/04/15 职场文书
大学生撤销处分思想汇报
2014/09/12 职场文书
金正昆讲礼仪观后感
2015/06/11 职场文书
毕业证明模板
2015/06/19 职场文书
高一军训口号
2015/12/25 职场文书
java泛型通配符详解
2021/07/25 Java/Android
vscode远程免密登入Linux服务器的配置方法
2022/06/28 Servers