通过jquery toggleClass()属性制作文章段落更改背景颜色


Posted in jQuery onMay 21, 2018

定义和用法

toggleClass() 方法对添加和移除被选元素的一个或多个类进行切换。

该方法检查每个元素中指定的类。如果不存在则添加类,如果已设置则删除之。这就是所谓的切换效果。

然而,通过使用 "switch" 参数,您能够规定只删除或只添加类。

语法

$(selector).toggleClass(classname,function(index,currentclass),switch)

参数 描述
classname 必需。规定添加或移除的一个或多个类名。如需规定若干个类,请使用空格分隔类名。
function(index,currentclass) 可选。规定返回需要添加/删除的一个或多个类名的函数。 index - 返回集合中元素的 index 位置。 currentclass - 返回被选元素的当前类名。
switch 可选。布尔值,规定是否仅仅添加(true)或移除(false)类。

用法简介:

jQuery制作文章段落更改背景颜色属性jquery toggleClass()属性。

效果图如下所示:

通过jquery toggleClass()属性制作文章段落更改背景颜色

效果展示      源码下载

文件引用:

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("input").click(function(){
  $("p").toggleClass("main");
 });
});
</script>

总结

以上所述是小编给大家介绍的通过jquery toggleClass()属性制作文章段落更改背景颜色,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jquery实现图片上传前本地预览
Apr 28 jQuery
jquery.masonry瀑布流效果
May 25 jQuery
使用 jQuery 实现表单验证功能
Jul 05 jQuery
jQuery 实现鼠标画框并对框内数据选中的实例代码
Aug 29 jQuery
jQuery滑动效果实现方法分析
Sep 05 jQuery
Easyui 关闭jquery-easui tab标签页前触发事件的解决方法
Apr 28 jQuery
jQuery实现高级检索功能
May 28 jQuery
jQuery创建折叠式菜单
Jun 15 jQuery
jquery.pager.js分页实现详解
Jul 29 jQuery
jQuery中DOM操作原则实例分析
Aug 01 jQuery
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
Oct 26 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
jQuery获取随机颜色的实例代码
May 21 #jQuery
如何用input标签和jquery实现多图片的上传和回显功能
May 16 #jQuery
jQuery中元素选择器(element)简单用法示例
May 14 #jQuery
jQuery中的类名选择器(.class)用法简单示例
May 14 #jQuery
基于jQuery实现无缝轮播与左右点击效果
May 13 #jQuery
jQuery实现模糊查询的方法分析
May 10 #jQuery
jQuery简单实现的HTML页面文本框模糊匹配查询功能完整示例
May 09 #jQuery
You might like
用PHP写的MySQL数据库用户认证系统代码
2007/03/22 PHP
php cookis创建实现代码
2009/03/16 PHP
通过php删除xml文档内容的方法
2015/01/23 PHP
基于JQuery的多标签实现代码
2012/09/19 Javascript
三种检测iPhone/iPad设备方向的方法
2014/04/23 Javascript
JQuery插件iScroll实现下拉刷新,滚动翻页特效
2014/06/22 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
js实现仿微博滚动显示信息的效果
2015/12/21 Javascript
基于jquery实现的仿优酷图片轮播特效代码
2016/01/13 Javascript
Bootstrap入门书籍之(零)Bootstrap简介
2016/02/17 Javascript
基于jQuery Tipso插件实现消息提示框特效
2016/03/16 Javascript
js选择器全面解析
2016/06/27 Javascript
BootStrap便签页的简单应用
2017/01/06 Javascript
JavaScript控制输入框中只能输入中文、数字和英文的方法【基于正则实现】
2017/03/03 Javascript
vue项目中引入noVNC远程桌面的方法
2018/03/05 Javascript
Webpack devServer中的 proxy 实现跨域的解决
2018/06/15 Javascript
JS合并两个数组的3种方法详解
2019/10/24 Javascript
JS实现轮播图效果
2020/01/11 Javascript
Python实现获取网站PR及百度权重
2015/01/21 Python
django+js+ajax实现刷新页面的方法
2017/05/22 Python
在python win系统下 打开TXT文件的实例
2018/04/29 Python
Python日志模块logging基本用法分析
2018/08/23 Python
python对绑定事件的鼠标、按键的判断实例
2019/07/17 Python
PIL包中Image模块的convert()函数的具体使用
2020/02/26 Python
用于ETL的Python数据转换工具详解
2020/07/21 Python
canvas实现烟花的示例代码
2020/01/16 HTML / CSS
阿玛尼意大利官网:Armani意大利
2018/10/30 全球购物
英国购买威士忌网站:Master of Malt
2019/09/26 全球购物
广州一家公司的.NET面试题
2016/06/11 面试题
精彩的英文自荐信
2014/01/30 职场文书
运动会口号大全
2014/06/07 职场文书
高中班主任评语
2014/12/30 职场文书
小学生通知书评语
2014/12/31 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
2019银行员工个人工作自我鉴定
2019/06/27 职场文书
Python Matplotlib库实现画局部图
2021/11/17 Python