pczhangtl
pczhangtl

Jquery - addClass() and removeClass()

 addClass() and removeClass() 用来添加CSS效果和删除CSS效果 

<html>
<head>
<style type="text/css">
  .highlight { 
  	background:yellow;
  }
 </style>
<script type="text/javascript" src="jquery-1.10.2.js"></script>
</head>
<body>
  <h1>jQuery add / remove css class example</h1>
 
  <p id="para1">This is paragraph 1</p>
  <p>This is paragraph 2</p>
  <p>This is paragraph 3</p>
  <p>This is paragraph 4</p>
 
  <button id="addClass">Add highlight</button>
  <button id="removeClass">Remove highlight</button>
 
<script type="text/javascript">
 
    $("#addClass").click(function () {
 
	  $('#para1').addClass('highlight');
 
    });
 
    $("#removeClass").click(function () {
 
	  $('#para1').removeClass('highlight');
 
    });
 
</script>
</body>
</html>


你可能感兴趣的:(removeClass,addClass)

  • django学习入门系列之第七点《jQuery j简单操作》 铁匠匠匠 djangodjango学习jquerypython前端框架前端笔记
    文章目录操作样式值的操作往期回顾操作样式addclass添加样式removeclass删除样式hasclass寻找样式值的操作获取自输入值内容$("#c1").text()//获取文本内容$("#c1").text("休息")//设置文本内容获取用户输入值$("#c1").val()//获取用户输入内容$("#c1").val("asd")//设置值创建标签//创建li标签$("")//添加li标
  • jquery 换肤 SkTj
    image.pnghtml//元素选中.siblings().removeClass("selected");//去掉其它同辈元素的选中.cookie("MyCssSkin",skinName,{path:'/',expires:10});}//]]>灰色紫色红色天蓝色橙色淡绿色时事新闻娱乐新闻jquery.cookie.js/**CookiepluginCopyright(c)2006Klaus
  • JQ 鼠标滑过按钮改变背景图片 后端Q .NETfunctioncssie
    发现用CSS用时IE6不兼容，所以就用见JQ实现$(document).ready(function(){//按钮样式切换$("#btFeedBack").hover(function(){$(this).removeClass("btFeed").addClass("btFeedhover");},function(){$(this).removeClass("btFeedhover").add
  • 调用打印机 LH8966
    css局部打印.Noprint{DISPLAY:none}.PageNext{PAGE-BREAK-AFTER:always}最终通过css来实现//调取打印机$scope.doPrintFun=function(){$(".datetimepicker").addClass("noprint");window.print();}样式放在index.html页面.noprint{display:n
  • Datatable表格单选+删除实现 IT和金融
    如果html前端为：那么单选实现为：$('#dataTablesDevicetbody').on('click','tr',function(){if($(this).hasClass('selected')){$(this).removeClass('selected');}else{tableLight.$('tr.selected').removeClass('selected');//其中
  • JQuery学习一 星石传说 python篇jquery学习前端
    JQuery学习一文章目录前言一、JQuery是什么？二、属性和内容2.1.jQuery选择器2.2.attr()方法2.3.text()方法2.4.val()方法2.5.小结2.6.添加内容三、操作CSS3.1.addClass()方法3.2.removeClass()方法3.3.toggleClass()方法3.4.CSS()方法3.5.jQuery尺寸方法总结前言一、JQuery是什么？jQ
  • jquery 点击事件切换样式 画江山 2019之前jquery
    jquery点击事件切换样式$('#FatherName').on('click','.ClassName',function(e){$('.ClassName').removeClass('active');$(this).addClass('active');});
  • 好用的classList chan7788
    元素身上有个classList对象add(类名)添加类名remove(类名)删除类名replace(替换谁，替换成什么)替换contains(类名)布尔值toggle(类名)切换返回值还是布尔值document.onclick=function(){//addClass(box,'red');box.classList.add('red','blue');console.log(box.class
  • jQuery语法知识（DOM操作） 糖糖糖果88 jQueryjquery前端javascript
    一、class属性:.addClass（）、.hasClass（）.removeClass（）、.toggleClass（）二、DOM插入并包裹现有内容1、.wrap(wrappingElement):在每个配的元素外层包上一个html元素。p{width:100px;height:50px;background-color:darkcyan;border-radius:5px;text-alig
  • jquery语法知识（DOM属性） 糖糖糖果88 jQueryjquery前端javascript
    1、.addClass(className):为每个配的元素添加指定的样式类名.pc{color:red;}haha$(function(){$("p").addClass("pc")})2.attr(atributeName):获取匹配的元素集合中的第一个元素的属性的值。设置每一个匹配元素的一个或多个属性参数一个参数：后面紧跟一个属性名两个参数：属性名和属性值设置元素属性值.pc{color:r
  • jQuery 获取并设置 CSS 类 —— W3school 详解 简单易懂（十五） 爱吃果蔬的猫 jquerycss前端
    通过jQuery，可以很容易地对CSS元素进行操作。jQuery操作CSSjQuery拥有若干进行CSS操作的方法。我们将学习下面这些：addClass()-向被选元素添加一个或多个类removeClass()-从被选元素删除一个或多个类toggleClass()-对被选元素进行添加/删除类的切换操作css()-设置或返回样式属性实例样式表下面的样式表将用于本页的所有例子：.important{f
  • jQuery添加/删除CSS类 GA_
    1、addClass()-向被选元素添加一个或多个类2、removeClass()-从被选元素删除一个或多个类3、toggleClass()-对被选元素进行添加/删除类的切换操作4、css()-设置或返回样式属性jQuery添加/删除CSS类操作我添加p标签class删除p标签的class添加/删除p标签的class添加p标签的css样式$("#button1").click(function()
  • 2019-10-31（1） ZxYi
    一、任务：左导航特效代码：1.html文件("#nav.navsBox.firstNav").click(function(){list=list.toggle();**/})(this).addClass("onbg");}).mouseout(function(){$(this).removeClass("onbg");});})*{margin:0px;padding:0px;font-si
  • 给每一个a标签添加点击事件，用到each 阿克兰
    $(#pageNav).find("a").each(function(){$(this).click(function(){pageNav.find("a").removeClass(tabPage.activeClass);$(this).addClass(tabPage.activeClass);iNum=$(this).index();$(pageMain).find("tr").hide
  • JQuery实现页面刷新后导航保留鼠标点击标签的样式 悦者生存
    $(function(){$(".nav-pillsli").removeClass("active");$(".nav-pillslia").each(function(){if($($(this))[0].href==String(window.location))$(this).parent().addClass('active');});});
  • HTML---JQurey的基本使用 北 染 星 辰 Web前端htmljavascript
    文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结本章目标（1）能够搭建jQuery开发环境（2）使用ready()方法加载页面、掌握jQuery语法使用addClass()方法和css()方法为元素添加CSS样式使用next()方法获取元素会使用show()和hide()显示和隐藏元素一.JQuery下载安装选择如下版本将点击后生成的网页内容保存使用ctrl+s保存到电脑
  • jQuery实现隔行变色 xi_weina jqueryjavascriptborderfunctiontableclass
    //实现table隔行变色超级简单的代码.one{background:#C00;}.two{background:#09F;}$(document).ready(function(){$("tr:even").addClass("one");//奇数行$("tr:odd").addClass("two");//偶数行});              //超简单的隔行变色哦
  • element-ui中怎么给el-table的某一行或某一列加样式 ~张小八~ vuecssvue.jsjavascript前端
    1.查阅element-ui官方文档后我们发现有如下属性:cell-class-name：2.为表格el-table添加该属性，并指定函数名：:cell-class-name=“addClass”通过addClass方法为指定行或列添加类名3.在methods中定义addClass方法，给需要更改样式的行或列添加类名：addClass({row,column,rowIndex,columnInde
  • el-table 组件 show-overflow-tooltip 属性源码解析 Fighting_p elementUI项目问题源码前端elementui
    完整源码table-body.js源码，主要代码在方法handleCellMouseEnter()中import{arrayFindIndex}from'element-ui/src/utils/util';import{getCell,getColumnByCell,getRowIdentity}from'./util';import{getStyle,hasClass,removeClass,
  • 选项卡切换 风起长林时
    单个切换functiontab(obj){//obj为jQuery对象obj.click(function(event){//click点击切换，hover悬停切换varthat=$(this);vartabBox=that.parent();varId="."+tabBox.attr("id");varon=tabBox.find("li").index(this);that.addClass(
  • 禁用元素点击事件（兼容IE8+） Mr_lee123 jscssjscss
    实现思路：chrome、firefox下利用CSS3属性pointer-events:none;元素永远不会成为鼠标事件的target。考虑到需兼容IE8+，利用js绑定点击事件，函数内直接returnfalse，阻止其他事件进行。js代码：//禁用点击事件functionnotClick(ele){$(ele).addClass('notClick').on('click',function(e
  • Jquery-一些方法 歌藏 jquery前端javascript
    $("xx").hide();隐藏XX元素$("xx").show();显示XX元素$("xx").toggle();来回切换：显示或隐藏XX元素$("xx").addClass("a");给元素添加类名为a$("xx").removeClass("aa);给元素移除类名为a$("xx").index();返回当前元素在兄弟中下标each方法的语法:$("xx").each(function(){
  • dome操作 啊灿2580
    检测类名hasClass(ele,name){returnele.className.match(newRegExp('(\\s|^)'+name+'(\\s|$)'));}添加类名addClass(ele,name){if(!this.hasClass(ele,name))ele.className+=""+name;}删除类名removeClass(ele,name){if(this.hasC
  • jQuery zooeydotmango
    引入jQueryCND地址：bootcss.com或unpkg.comjquery与原生JS的区别$.noConflict()//方法$.each()$('ul').addClass()//dom操作$('p').text('hi')jquery对象不是数组，是一个类数组对象，拥有length属性jquery和原生JS各自有一套自己的方法，二者之间的转换：$('p')[0]//dom对象$('p'
  • vue点击添加样式 33455432 javascript前端
    {{item.orderNo}}isactive:false,.addclass{background:#F1F3F6;color:#409EFF;}
  • jQuery轮播图 一坤年的回忆 jquery前端javascript
    所运用到的方法//根据jQuery的淡入淡出实现//用到的jQuery方法fadeIn();//淡入fadeOut();//淡出addClass();//给该元素添加一个class类名siblings();//用于选取每个匹配元素的所有同辈元素(不包括自己),并以jQuery对象的形式返回。eq()：//用于获取匹配元素集合中特定位置的元素。这个方法的参数是一个索引值，//它返回的是集合中对应索引
  • 如何利用jQuery来向一个元素中添加和移除CSS类? Good luck—dys jquerycss前端
    使用jQuery向一个元素中添加和移除CSS类非常简单。下面是一个示例，演示了如何使用jQuery来实现这一功能：//添加CSS类$('#myElement').addClass('newClass');//移除CSS类$('#myElement').removeClass('oldClass');在这个示例中，假设我们有一个id为“myElement”的元素。要向这个元素中添加一个新的CSS类，
  • CSS 极客_Ls
    .addClass()为每个匹配的元素添加指定的样式类名.css()获取匹配元素集合中的第一个元素的样式属性的值设置每个匹配元素的一个或多个CSS属性.hasClass()确定任何一个匹配元素是否有被分配给定的（样式）类。.height()获取匹配元素集合中的第一个元素的当前计算高度值。设置每一个匹配元素的高度值。.innerHeight()为匹配的元素集合中获取第一个元素的当前计算高度值,包括p
  • JqueryDemo ZPNGU
    //如下是需求//window.jQuery=???//window.$=jQuery//var$div=$('div')//$div.addClass('red')//可将所有div的class添加一个red//$div.setText('hi')//可将所有div的textContent变为hiwindow.jQuery=function(nodeOrSelector){//输入进来的可能是字
  • div 不可点击设置 一拳莫敌 前端javascripthtml
    css内.cantClick{pointer-events:none;}js内//id$('#domId').addClass("cantClick");//添加不可点击class$('#domId').removeClass("cantClick");//删除不可点击Class//class$('.domClass').addClass("cantClick");//添加不可点击class$('
  • [黑洞与暗粒子]没有光的世界 comsci
         无论是相对论还是其它现代物理学,都显然有个缺陷,那就是必须有光才能够计算      但是,我相信,在我们的世界和宇宙平面中,肯定存在没有光的世界....      那么,在没有光的世界,光子和其它粒子的规律无法被应用和考察,那么以光速为核心的 &nbs
  • jQuery Lazy Load 图片延迟加载 aijuans jquery
    基于 jQuery 的图片延迟加载插件，在用户滚动页面到图片之后才进行加载。 对于有较多的图片的网页，使用图片延迟加载，能有效的提高页面加载速度。 版本： jQuery v1.4.4+ jQuery Lazy Load v1.7.2 注意事项： 需要真正实现图片延迟加载，必须将真实图片地址写在 data-original 属性中。若 src
  • 使用Jodd的优点 Kai_Ge jodd
    1.  简化和统一 controller ，抛弃 extends SimpleFormController ，统一使用 implements Controller 的方式。 2.  简化 JSP 页面的 bind, 不需要一个字段一个字段的绑定。 3.  对 bean 没有任何要求，可以使用任意的 bean 做为 formBean。   使用方法简介
  • jpa Query转hibernate Query 120153216 Hibernate
    public List<Map> getMapList(String hql, Map map) { org.hibernate.Query jpaQuery = entityManager.createQuery(hql); if (null != map) { for (String parameter : map.keySet()) { jp
  • Django_Python3添加MySQL/MariaDB支持 2002wmj mariaDB
    现状 首先，[email protected] 中默认的引擎为 django.db.backends.mysql 。但是在Python3中如果这样写的话，会发现 django.db.backends.mysql 依赖 MySQLdb[5] ，而 MySQLdb 又不兼容 Python3 于是要找一种新的方式来继续使用MySQL。 MySQL官方的方案 首先据MySQL文档[3]说，自从MySQL
  • 在SQLSERVER中查找消耗IO最多的SQL 357029540 SQL Server
    返回做IO数目最多的50条语句以及它们的执行计划。 select top 50   (total_logical_reads/execution_count) as avg_logical_reads,  (total_logical_writes/execution_count) as avg_logical_writes,  (tot
  • spring UnChecked 异常 官方定义！ 7454103 spring
      如果你接触过spring的 事物管理！那么你必须明白 spring的 非捕获异常！ 即 unchecked 异常！ 因为 spring 默认这类异常事物自动回滚！！ public static boolean isCheckedException(Throwable ex) { return !(ex instanceof RuntimeExcep
  • mongoDB 入门指南、示例 adminjun javamongodb操作
    一、准备工作 1、 下载mongoDB 下载地址：http://www.mongodb.org/downloads 选择合适你的版本 相关文档：http://www.mongodb.org/display/DOCS/Tutorial 2、 安装mongoDB A、 不解压模式： 将下载下来的mongoDB-xxx.zip打开，找到bin目录，运行mongod.exe就可以启动服务，默
  • CUDA 5 Release Candidate Now Available aijuans CUDA
    The CUDA 5 Release Candidate is now available at http://developer.nvidia.com/<wbr></wbr>cuda/cuda-pre-production. Now applicable to a broader set of algorithms, CUDA 5 has advanced fe
  • Essential Studio for WinRT网格控件测评 Axiba JavaScripthtml5
    Essential Studio for WinRT界面控件包含了商业平板应用程序开发中所需的所有控件，如市场上运行速度最快的grid 和chart、地图、RDL报表查看器、丰富的文本查看器及图表等等。同时，该控件还包含了一组独特的库，用于从WinRT应用程序中生成Excel、Word以及PDF格式的文件。此文将对其另外一个强大的控件——网格控件进行专门的测评详述。 网格控件功能 1、
  • java 获取windows系统安装的证书或证书链 bewithme windows
          有时需要获取windows系统安装的证书或证书链，比如说你要通过证书来创建java的密钥库  。 有关证书链的解释可以查看此处 。   public static void main(String[] args) { SunMSCAPI providerMSCAPI = new SunMSCAPI(); S
  • NoSQL数据库之Redis数据库管理(set类型和zset类型) bijian1013 redis数据库NoSQL
    4.sets类型         Set是集合，它是string类型的无序集合。set是通过hash table实现的，添加、删除和查找的复杂度都是O(1)。对集合我们可以取并集、交集、差集。通过这些操作我们可以实现sns中的好友推荐和blog的tag功能。         sadd：向名称为key的set中添加元
  • 异常捕获何时用Exception，何时用Throwable bingyingao
    用Exception的情况 try {        //可能发生空指针、数组溢出等异常         } catch (Exception e) {          
  • 【Kafka四】Kakfa伪分布式安装 bit1129 kafka
    在http://bit1129.iteye.com/blog/2174791一文中，实现了单Kafka服务器的安装，在Kafka中，每个Kafka服务器称为一个broker。本文简单介绍下，在单机环境下Kafka的伪分布式安装和测试验证   1. 安装步骤   Kafka伪分布式安装的思路跟Zookeeper的伪分布式安装思路完全一样，不过比Zookeeper稍微简单些(不
  • Project Euler bookjovi haskell
    Project Euler是个数学问题求解网站，网站设计的很有意思，有很多problem，在未提交正确答案前不能查看problem的overview，也不能查看关于problem的discussion thread，只能看到现在problem已经被多少人解决了，人数越多往往代表问题越容易。     看看problem 1吧： Add all the natural num
  • Java-Collections Framework学习与总结-ArrayDeque BrokenDreams Collections
            表、栈和队列是三种基本的数据结构，前面总结的ArrayList和LinkedList可以作为任意一种数据结构来使用，当然由于实现方式的不同，操作的效率也会不同。         这篇要看一下java.util.ArrayDeque。从命名上看
  • 读《研磨设计模式》-代码笔记-装饰模式-Decorator bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ import java.io.BufferedOutputStream; import java.io.DataOutputStream; import java.io.FileOutputStream; import java.io.Fi
  • Maven学习(一) chenyu19891124 Maven私服
        学习一门技术和工具总得花费一段时间，5月底6月初自己学习了一些工具，maven+Hudson+nexus的搭建，对于maven以前只是听说，顺便再自己的电脑上搭建了一个maven环境，但是完全不了解maven这一强大的构建工具，还有ant也是一个构建工具，但ant就没有maven那么的简单方便，其实简单点说maven是一个运用命令行就能完成构建，测试，打包，发布一系列功
  • [原创]JWFD工作流引擎设计----节点匹配搜索算法(用于初步解决条件异步汇聚问题) 补充 comsci 算法工作PHP搜索引擎嵌入式
    本文主要介绍在JWFD工作流引擎设计中遇到的一个实际问题的解决方案，请参考我的博文"带条件选择的并行汇聚路由问题"中图例A2描述的情况(http://comsci.iteye.com/blog/339756),我现在把我对图例A2的一个解决方案公布出来，请大家多指点 节点匹配搜索算法(用于解决标准对称流程图条件汇聚点运行控制参数的算法) 需要解决的问题：已知分支
  • Linux中用shell获取昨天、明天或多天前的日期 daizj linuxshell上几年昨天获取上几个月
    在Linux中可以通过date命令获取昨天、明天、上个月、下个月、上一年和下一年 # 获取昨天 date -d 'yesterday'  # 或 date -d 'last day' # 获取明天 date -d 'tomorrow'   # 或 date -d 'next day' # 获取上个月 date -d 'last month' #
  • 我所理解的云计算 dongwei_6688 云计算
          在刚开始接触到一个概念时，人们往往都会去探寻这个概念的含义，以达到对其有一个感性的认知，在Wikipedia上关于“云计算”是这么定义的，它说：        Cloud computing is a phrase used to describe a variety of computing co
  • YII CMenu配置 dcj3sjt126com yii
    Adding id and class names to CMenu We use the id and htmlOptions to accomplish this. Watch. //in your view $this->widget('zii.widgets.CMenu', array( 'id'=>'myMenu', 'items'=>$this-&g
  • 设计模式之静态代理与动态代理 come_for_dream 设计模式
    静态代理与动态代理        代理模式是java开发中用到的相对比较多的设计模式，其中的思想就是主业务和相关业务分离。所谓的代理设计就是指由一个代理主题来操作真实主题，真实主题执行具体的业务操作，而代理主题负责其他相关业务的处理。比如我们在进行删除操作的时候需要检验一下用户是否登陆，我们可以删除看成主业务，而把检验用户是否登陆看成其相关业务
  • 【转】理解Javascript 系列 gcc2ge JavaScript
    理解Javascript_13_执行模型详解 摘要: 在《理解Javascript_12_执行模型浅析》一文中,我们初步的了解了执行上下文与作用域的概念，那么这一篇将深入分析执行上下文的构建过程，了解执行上下文、函数对象、作用域三者之间的关系。函数执行环境简单的代码:当调用say方法时，第一步是创建其执行环境，在创建执行环境的过程中，会按照定义的先后顺序完成一系列操作:1.首先会创建一个
  • Subsets II hcx2013 set
    Given a collection of integers that might contain duplicates, nums, return all possible subsets. Note: Elements in a subset must be in non-descending order. The solution set must not conta
  • Spring4.1新特性——Spring缓存框架增强 jinnianshilongnian spring4
    目录 Spring4.1新特性——综述 Spring4.1新特性——Spring核心部分及其他 Spring4.1新特性——Spring缓存框架增强 Spring4.1新特性——异步调用和事件机制的异常处理 Spring4.1新特性——数据库集成测试脚本初始化 Spring4.1新特性——Spring MVC增强 Spring4.1新特性——页面自动化测试框架Spring MVC T
  • shell嵌套expect执行命令 liyonghui160com
        一直都想把expect的操作写到bash脚本里,这样就不用我再写两个脚本来执行了,搞了一下午终于有点小成就,给大家看看吧.   系统:centos 5.x   1.先安装expect yum -y install expect   2.脚本内容: cat auto_svn.sh   #!/bin/bash
  • Linux实用命令整理 pda158 linux
    0. 基本命令 　　linux 基本命令整理 　 　1. 压缩 解压 　　tar -zcvf a.tar.gz a   #把a压缩成a.tar.gz 　　tar -zxvf a.tar.gz     #把a.tar.gz解压成a 　 　2. vim小结 　　2.1 vim替换 　　:m,ns/word_1/word_2/gc  
  • 独立开发人员通向成功的29个小贴士 shoothao 独立开发
    概述：本文收集了关于独立开发人员通向成功需要注意的一些东西,对于具体的每个贴士的注解有兴趣的朋友可以查看下面标注的原文地址。 明白你从事独立开发的原因和目的。 保持坚持制定计划的好习惯。 万事开头难，第一份订单是关键。 培养多元化业务技能。 提供卓越的服务和品质。 谨小慎微。 营销是必备技能。 学会组织，有条理的工作才是最有效率的。 “独立
  • JAVA中堆栈和内存分配原理 uule java
    1、栈、堆 1.寄存器：最快的存储区, 由编译器根据需求进行分配,我们在程序中无法控制.2. 栈：存放基本类型的变量数据和对象的引用，但对象本身不存放在栈中，而是存放在堆（new 出来的对象）或者常量池中（字符串常量对象存放在常量池中。）3. 堆：存放所有new出来的对象。4. 静态域：存放静态成员（static定义的）5. 常量池：存放字符串常量和基本类型常量（public static f
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他