jquery 学习之二 属性(类)


Posted in Javascript onNovember 25, 2010

addClass(class)

为每个匹配的元素添加指定的类名。
Adds the specified class(es) to each of the set of matched elements.

返回值

jQuery

参数

class (String) : 一个或多个要添加到元素中的CSS类名,请用空格分开

示例

为匹配的元素加上 'selected' 类

HTML 代码:

<p>Hello</p>

jQuery 代码:

$("p").addClass("selected");

结果:

[ <p class="selected">Hello</p> ]

为匹配的元素加上 selected highlight 类

HTML 代码:

<p>Hello</p>

jQuery 代码:

$("p").addClass("selected highlight");

结果:

[ <p class="selected highlight">Hello</p> ]
------------------------------------------------------------------------------------------------------------------------------

removeClass(class)

从所有匹配的元素中删除全部或者指定的类。
Removes all or the specified class(es) from the set of matched elements.

返回值

jQuery

参数

class (String) : (可选) 一个或多个要删除的CSS类名,请用空格分开

示例

从匹配的元素中删除 'selected' 类

HTML 代码:

<p class="selected first">Hello</p>

jQuery 代码:

$("p").removeClass("selected");

结果:

[ <p>Hello</p> ]

删除匹配元素的所有类

HTML 代码:

<p class="selected first">Hello</p>

jQuery 代码:

$("p").removeClass();

结果:

[ <p>Hello</p> ]
------------------------------------------------------------------------------------------------------------------------------

toggleClass(class)

如果存在(不存在)就删除(添加)一个类。
Adds the specified class if it is not present, removes the specified class if it is present.

返回值

jQuery

参数

class (String) :CSS类名

示例

为匹配的元素切换 'selected' 类

HTML 代码:

<p>Hello</p><p class="selected">Hello Again</p>

jQuery 代码:

$("p").toggleClass("selected");

结果:

[ <p class="selected">Hello</p>, <p>Hello Again</p> ]
 
Javascript 相关文章推荐
有效的捕获JavaScript焦点的方法小结
Oct 08 Javascript
JavaScript 语法集锦 脚本之家基础推荐
Nov 15 Javascript
利用jQuery的$.event.fix函数统一浏览器event事件处理
Dec 21 Javascript
JavaScript类和继承 constructor属性
Mar 04 Javascript
关于Javascript模块化和命名空间管理的问题说明
Dec 06 Javascript
jQuery对表单的操作代码集合
Apr 06 Javascript
中文字符串截取的js函数代码
Apr 17 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
Jul 27 Javascript
react.js 父子组件数据绑定实时通讯的示例代码
Sep 25 Javascript
10行原生JS实现文字无缝滚动(超简单)
Jan 02 Javascript
JavaScript事件对象深入详解
Dec 30 Javascript
初窥JQuery(二) 事件机制(1)
Nov 25 #Javascript
初窥JQuery(一)jquery选择符 必备知识点
Nov 25 #Javascript
初窥JQuery-Jquery简介 入门了解篇
Nov 25 #Javascript
学习并汇集javascript匿名函数
Nov 25 #Javascript
汉化英文版的Dreamweaver CS5并自动提示jquery
Nov 25 #Javascript
XMLHTTPRequest的属性和方法简介
Nov 23 #Javascript
写给想学习Javascript的朋友一点学习经验小结
Nov 23 #Javascript
You might like
php读取30天之内的根据算法排序的代码
2008/04/06 PHP
php设计模式 Visitor 访问者模式
2011/06/28 PHP
php实现parent调用父类的构造方法与被覆写的方法
2015/02/11 PHP
php 流程控制switch的简单实例
2016/06/07 PHP
php生成word并下载代码实例
2019/03/15 PHP
laravel框架模型中非静态方法也能静态调用的原理分析
2019/11/23 PHP
PHP全局使用Laravel辅助函数dd
2019/12/26 PHP
Javascript 不能释放内存.
2006/09/07 Javascript
js 加载并解析XML字符串的代码
2009/12/13 Javascript
JavaScript的Module模式编程深入分析
2013/08/13 Javascript
javascript的事件触发器介绍的实现
2014/06/05 Javascript
JavaScript中使用arguments获得函数传参个数实例
2014/08/27 Javascript
jQuery使用attr()方法同时设置多个属性值用法实例
2015/03/26 Javascript
jquery UI Datepicker时间控件的使用及问题解决
2016/04/28 Javascript
几种响应式文字详解
2017/05/19 Javascript
Node.js 基础教程之全局对象
2017/08/06 Javascript
jQuery实现IE输入框完成placeholder标签功能的方法
2017/09/20 jQuery
微信小程序实现添加手机联系人功能示例
2017/11/30 Javascript
VSCode配置react开发环境的步骤
2017/12/27 Javascript
vue移动端微信授权登录插件封装的实例
2018/08/28 Javascript
通过js示例讲解时间复杂度与空间复杂度
2019/08/06 Javascript
Vue实现导航栏菜单
2020/08/19 Javascript
Python DataFrame 设置输出不显示index(索引)值的方法
2018/06/07 Python
numpy linalg模块的具体使用方法
2019/05/26 Python
python输入多行字符串的方法总结
2019/07/02 Python
python 实现rolling和apply函数的向下取值操作
2020/06/08 Python
python字符串的index和find的区别详解
2020/06/20 Python
巴黎欧莱雅法国官网:L’Oreal Paris
2019/04/30 全球购物
加州风格的游泳和沙滩装品牌:Cupshe
2019/06/10 全球购物
测绘工程个人的自我评价
2013/11/10 职场文书
《童年的发现》教学反思
2014/02/14 职场文书
元旦文艺汇演主持词
2014/03/26 职场文书
学术诚信承诺书
2014/05/26 职场文书
寻衅滋事罪辩护词
2015/05/21 职场文书
感恩老师主题班会
2015/08/12 职场文书
2016年读书月活动总结范文
2016/04/06 职场文书