jQuery属性--addClass()和removeClass()
addClass(class|fn)
概述
为每个匹配的元素添加指定的类名
参数
class 一个或多个要添加到元素中的CSS类名，请用空格分开；
function(index, class) 此函数必须返回一个或多个空格分隔的class名。接受两个参数，index参数为对象在这个集合中的索引值，class参数为这个对象原先的class属性值
removeClass([class|fn])
概述
class 一个或多个要删除的CSS类名，请用空格分开
参数
function(index, class) 此函数必须返回一个或多个空格分隔的class名。接受两个参数，index参数为对象在这个集合中的索引值，class参数为这个对象原先的class属性值
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
<title></title>
<style>
.main{
color: #FF0000;
font-weight: bold;
}
</style>
<script>
$(document).ready(function(){
//addClass为每个匹配的元素添加指定的类名
$("button:first").click(function(){
$("p:first").addClass("main");
});
//removeClass从所有匹配的元素中删除全部或者指定的类
$("button:last").click(function(){
$("p:last").removeClass("main");
});
});
</script>
</head>
<body>
<p>第一个段落。</p>
<p class="main">第二个段落。</p>
<button>addClass</button>
<button>removeClass</button>
</body>
</html>
jQuery属性--addClass()和removeClass()的更多相关文章
- jquery的addClass、removeClass、toggleClass方法
1.addClass()添加类 1.1 用jquery为某一个元素添加类 $("div").addClass("active");//给div元素添加activ ...
- 原生JS实现JQuery的addClass和removeClass
代码如下: document.getElementById("btn").classList.add("active"); document.getElemen ...
- Jquery重新学习之三[属性addClass(),removeClass(),toggleClass()]
1:属性.addClass(class|fn)及.removeClass(class|fn) 1.1 .addClass(class) 参数class一个或多个要添加到元素中的CSS类名,请用空格分开 ...
- 关于通过addClass与removeClass用jquery控制有良好兼容的CSS3样式
hi:)好久不见~最近被jquery的animate对某些CSS3特性不兼容搞的头晕眼花,果断百度,阅读了一些高手的博客后突然发现平常很少用到的addClass和removeClass属性居然还可以这 ...
- jQuery 属性操作 - addClass() 方法
使用 addClass() 和 removeClass() 来移除 class,并添加新的 class. <html> <head> <script type=" ...
- jQuery的addClass,removeClass和toggleClass方法
jQuery的addClass,removeClass和toggleClass方法,最后一个方法在某一情形之下,可以替代前面2个方法. 第一个方法addClass为元素添加一个class. 第二个方法 ...
- jQuery属性/CSS使用例子
jQuery属性/CSS 1..attr() 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性. 例1:获取元素的属性的值 <p title="段落 ...
- jQuery属性操作
jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...
- js实现css、addClass、removeClass和toggleClass
JQuery中获取CSS样式css(name):访问第一匹配元素的样式属性css(name,value):在所有匹配的元素中,设置一个样式属性的值css(properties):把一个“名/值对”对象 ...
随机推荐
- python之文件操作的函数
file=open("e:\\c.py","w",encoding="utf-8")date=file.close() ...
- Javascript 面向对象编程（一）：封装 作者：yuan一峰
学习Javascript,最难的地方是什么? 我觉得,Object(对象)最难.因为Javascript的Object模型很独特,和其他语言都不一样,初学者不容易掌握. 下面就是我的学习笔记,希望对大 ...
- mysql之show engine innodb status解读（转）
add by zhj: 我第一次知道这个命令是线上服务出了问题,然后同事用这个命令去查看死锁.但用这个命令看死锁有一定的局限性,它只能看到最后一次死锁, 而且只能看到死锁环中的两个事务所执行的最后一条 ...
- rpm 安装软件包
RPM 是RedHat Package Manager (RedHat软件包管理工具)类似windows里面的“添加/删除程序”,rpm执行安装包 RPM执行安装.删除.更新 常用命令组合 -ivh: ...
- 模拟django配置环境进行数据增删改查，测试的时候有用
import os if __name__ == '__main__': os.environ.setdefault('DJANGO_SETTINGS_MODULE','day76.settings' ...
- ORM之视图层
1.request对象 前台POST传来的数据,包装到POST字典中request.POST 前台浏览器窗口携带的数据,包装到GET字典中request.GET 前台请求的方式,request.met ...
- ionic 版本内更新问题汇总
1.签名不一致导致的更新失败 2.解析软件包出现问题 3.当文件下载完.在android 8.0中不能打开apk包的问题 解决方案:在config.xml中添加: <platform name= ...
- ELKStack的基础入门和中文指南
一.ELKStack的中文指南 redhat系列配置repo源 rpm --import https://artifacts.elastic.co/GPG-KEY-elasticsearch vi / ...
- 虚拟货币ICO是什么意思 看完秒懂
有这样一个市场,与90年代的互联网泡沫及其相似,它被许多金融界大咖怒指为丧失道德底线的圈钱工具,更被投资者而疯狂追捧.是的,没错,它就是近二年火遍全球的虚拟货币ICO.那么,对于很多投资小白来说,虚拟 ...
- [Java in NetBeans] Lesson 09. Switch / If-Else Ladder
这个课程的参考视频和图片来自youtube. 主要学到的知识点有: 1. Nested If-else statement (if-else ladder) /** * 90 and above == ...