jQuery 属性操作 - addClass() 和 removeClass() 方法
实例
向第一个 p 元素添加一个类：
$("button").click(function(){
$("p:first").addClass("intro");
});
定义和用法
addClass() 方法向被选元素添加一个或多个类。
该方法不会移除已存在的 class 属性，仅仅添加一个或多个 class 属性。
提示：如需添加多个类，请使用空格分隔类名。
语法
$(selector).addClass(class)
| 参数 | 描述 |
|---|---|
| class | 必需。规定一个或多个 class 名称。 |
使用函数来添加类
使用函数向被选元素添加类。
语法
$(selector).addClass(function(index,oldclass))
$(document).ready(function(){
$("button").click(function(){
$("p:first").addClass("intro note");
});
});
removeClass() 方法 实例
移除所有 <p> 的 "intro" 类：
$("button").click(function(){
$("p:first").removeClass("intro");
});
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$('ul li').removeClass(function() {
return 'listitem_' + $(this).index();
});
});
});
</script>
<style type="text/css">
.listitem_1, .listitem_3
{
color:red;
}
.listitem_0, .listitem_2
{
color:blue;
}
</style>
</head> <body>
<h1 id="h1">This is a heading</h1>
<ul>
<li class="listitem_0">Apple</li>
<li class="listitem_1">IBM</li>
<li class="listitem_2">Microsoft</li>
<li class="listitem_3">Google</li>
</ul>
<button>删除列表项中的类</button>
</body>
</html>
jQuery 属性操作 - addClass() 和 removeClass() 方法的更多相关文章
- jQuery 属性操作 - addClass() 方法
使用 addClass() 和 removeClass() 来移除 class,并添加新的 class. <html> <head> <script type=" ...
- 原生js模拟jquery中的addClass和removeClass方法
js代码: //添加类 function addClass(obj,className) { if(obj.className == '') { //如果没有class obj.className = ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...
- 【转发】JQuery中操作Css样式的方法
JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...
- jQuery属性操作（四）
通过阅读jQuery为属性操作封装的基本方法和为处理兼容性问题提供的hooks,发现jQuery在属性操作方面并没有做过多的设计,只是处理一下兼容性问题,然后调用基础的DOM操作方法.以下是对JQue ...
- jquery——属性操作、特殊效果
1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...
- jQuery 属性操作 - val() 方法
val() 方法返回或设置被选元素的值. 元素的值是通过 value 属性设置的.该方法大多用于 input 元素. 如果该方法未设置参数,则返回被选元素的当前值. <html> < ...
- jQuery 属性操作 - attr() 方法
定义和用法 attr() 方法设置或返回被选元素的属性值. 根据该方法不同的参数,其工作方式也有所差异. 实例1 设置被选元素的属性和值. <html><head><sc ...
- jQuery属性操作
jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...
随机推荐
- AdobeCS3DesignPremiumChs_Greendown.cn使用注册机激活失败重新激活操作方法
解决Adobe Acrobat 9 Pro序列号无效/重新激活方法 1.删除C:\Program Files\Common Files\Adobe\Adobe PCD\cache\cache.db和C ...
- 又续CSS3
这次主要讲呢 1.box-sizing属性 语法:box-sizing: content-box|border-box|inherit; box-sizing属性的用法 box-sizing属性可以为 ...
- Linux 内核超时导致虚拟机无法正常启动
问题描述 当 Linux 虚拟机启动时,通过串口输出或者启动日志, 观察到超时的报错.导致虚拟机无法正常启动和连接. 问题分析 常见的超时报错范例如下: 复制 INFO: task swapper:1 ...
- easyui的解析器Parser
平时使用easyui做框架开发时,都知道easyui的模块组件能通过属性方法或js方法来渲染,本质上是通过parser解析器来处理实现的,因为多数情况下都是自动触发完成整个页面的解析,所以没有感觉到它 ...
- 【NLP汉语自然语言处理与实践】分词_笔记
一.两种分词标准: 1. 粗粒度. 将词作为最小基本单位.比如:浙江大学. 主要用于自然语言处理的各种应用. 2. 细粒度. 不仅对词汇继续切分,也对词汇内部的语素进行切分.比如:浙江/大学. 主要用 ...
- oracle客户端plsql安装
1.确认版本 自己的操作系统版本(32位还是64位),oracle instant client(oracle客户端版本)和plsql版本 我自己的版本是:oracle客户端版本 64位,plsql ...
- SpringBoot页面访问处理
SpringBoot页面访问处理 1.介绍 Springboot推荐使用thymeleaf模板引擎搭载html页面实现jsp动态渲染效果,因此这里才会用该种方案进行. 2.集成步骤 引入thymele ...
- DESCRIBE:When you mouse click right-side is open an application and click left-side is attribution.
DESCRIBE:When you mouse click right-side is open an application and click left-side is attribution. ...
- 贴现力 (force of discount)
一.定义 用贴现函数a-1(t) 代替累积函数,在 t 时刻的贴现力为 增加一个负号使得贴现力为正. 二.重要的公式
- Ace admin 如何实现类似于freamset加载页面
如上标题所述,ace admin做后台页面的时候,可以实现类似于用freamset的功能,但是ace admin做的比freamset更好,他可以用异步加载的形式展示,而加载的页面的内容可以尽可能的少 ...