jQuery 属性操作 - addClass() 方法

使用 addClass() 和 removeClass() 来移除 class，并添加新的 class。
<html>

<head>

<script type="text/javascript" src="/jquery/jquery.js"></script>

<script type="text/javascript">

　　$(document).ready(function(){

  　　　　$("button").click(function(){

    　　　　　　$('p').addClass(function(n){

      　　　　　　　　return 'par_' + n;

    　　　　　　});

  　　　　});

　　});

</script>

<style type="text/css">

　　.par_0{

　　　　color:blue;

　　}

　　.par_1{

　　　　color:red;

　　}

</style>

</head>

 

你可能感兴趣的:(addClass)

  • django学习入门系列之第七点《jQuery j简单操作》 铁匠匠匠 djangodjango学习jquerypython前端框架前端笔记
    文章目录操作样式值的操作往期回顾操作样式addclass添加样式removeclass删除样式hasclass寻找样式值的操作获取自输入值内容$("#c1").text()//获取文本内容$("#c1").text("休息")//设置文本内容获取用户输入值$("#c1").val()//获取用户输入内容$("#c1").val("asd")//设置值创建标签//创建li标签$("")//添加li标
  • 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
  • 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
  • 选项卡切换 风起长林时
    单个切换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$('
  • 在angular cli 如何使用jquery 高山流水kay
    npminstall--savejquerynpminstall@types/jquery--save在ts文件中引入：import*as$from"jquery";测试看是否成功：$('body').addClass('aaa');
  • 使用MFC操作EXCEL文件 worldy 功能实现
    使用MFC操作EXCEL文件分类：EXCEL2012-09-0309:3014914人阅读评论(5)收藏举报excelmfcbooks工作applicationoffice一、加载1、在VC6.0里创建一个MFC工程2、打开MFCClassWizard窗口(查看—>建立类向导)，选择Automation，单击AddClass按钮，选择Fromatypelibrary…，弹出文件选择对话框，之后定位
  • VC操作Excel之基本操作（颜色等） form88 C++excel
    EXCEL里如何知道某种颜色的ColorIndex的值===fag::=============================================================Excel库的插入在我们MFC的工程中，按Ctrl+W打开MFC类向导对话框，点击“AddClass…”->“FromatypeLibrary…”，找到你所使用的excel类型库，我使用的在目录C:/Prog
  • ASM系列六 利用TreeApi 添加和移除类成员 lijingyao8206 jvm动态代理ASM字节码技术TreeAPI
        同生成的做法一样，添加和移除类成员只要去修改fields和methods中的元素即可。这里我们拿一个简单的类做例子，下面这个Task类，我们来移除isNeedRemove方法，并且添加一个int 类型的addedField属性。   package asm.core; /** * Created by yunshen.ljy on 2015/6/
  • Springmvc-权限设计 bee1314 springWebjsp
    万丈高楼平地起。 权限管理对于管理系统而言已经是标配中的标配了吧，对于我等俗人更是不能免俗。同时就目前的项目状况而言，我们还不需要那么高大上的开源的解决方案，如Spring Security，Shiro。小伙伴一致决定我们还是从基本的功能迭代起来吧。 目标： 1.实现权限的管理（CRUD） 2.实现部门管理 （CRUD) 3.实现人员的管理 （CRUD） 4.实现部门和权限
  • 算法竞赛入门经典（第二版）第2章习题 CrazyMizzz c算法
    2.4.1 输出技巧 #include <stdio.h> int main() { int i, n; scanf("%d", &n); for (i = 1; i <= n; i++) printf("%d\n", i); return 0; } 习题2-2 水仙花数(daffodil
  • struts2中jsp自动跳转到Action 麦田的设计者 jspwebxmlstruts2自动跳转
    1、在struts2的开发中，经常需要用户点击网页后就直接跳转到一个Action，执行Action里面的方法，利用mvc分层思想执行相应操作在界面上得到动态数据。毕竟用户不可能在地址栏里输入一个Action（不是专业人士）   2、＜jsp:forward page="xxx.action" /＞ ，这个标签可以实现跳转，page的路径是相对地址,不同与jsp和j
  • php 操作webservice实例 IT独行者 PHPwebservice
    首先大家要简单了解了何谓webservice，接下来就做两个非常简单的例子，webservice还是逃不开server端与client端。我测试的环境为：apache2.2.11 php5.2.10做这个测试之前，要确认你的php配置文件中已经将soap扩展打开，即extension=php_soap.dll; OK 现在我们来体验webservice //server端 serve
  • Windows下使用Vagrant安装linux系统 _wy_ windowsvagrant
    准备工作： 下载安装 VirtualBox ：https://www.virtualbox.org/ 下载安装 Vagrant ：http://www.vagrantup.com/ 下载需要使用的 box ： 官方提供的范例：http://files.vagrantup.com/precise32.box 还可以在 http://www.vagrantbox.es/ 
  • 更改linux的文件拥有者及用户组(chown和chgrp) 无量 clinuxchgrpchown
    本文（转） http://blog.163.com/yanenshun@126/blog/static/128388169201203011157308/ http://ydlmlh.iteye.com/blog/1435157 一、基本使用： 使用chown命令可以修改文件或目录所属的用户：        命令
  • linux下抓包工具 矮蛋蛋 linux
    原文地址： http://blog.chinaunix.net/uid-23670869-id-2610683.html tcpdump -nn -vv -X udp port 8888 上面命令是抓取udp包、端口为8888 netstat -tln 命令是用来查看linux的端口使用情况 13 . 列出所有的网络连接 lsof -i 14. 列出所有tcp 网络连接信息 l
  • 我觉得mybatis是垃圾！：“每一个用mybatis的男纸，你伤不起” alafqq mybatis
    最近看了  每一个用mybatis的男纸，你伤不起 原文地址 ：http://www.iteye.com/topic/1073938 发表一下个人看法。欢迎大神拍砖； 个人一直使用的是Ibatis框架，公司对其进行过小小的改良； 最近换了公司，要使用新的框架。听说mybatis不错；就对其进行了部分的研究； 发现多了一个mapper层；个人感觉就是个dao；
  • 解决java数据交换之谜 百合不是茶 数据交换
    交换两个数字的方法有以下三种 ，其中第一种最常用   /* 输出最小的一个数 */ public class jiaohuan1 { public static void main(String[] args) { int a =4; int b = 3; if(a<b){ // 第一种交换方式 int tmep =
  • 渐变显示 bijian1013 JavaScript
    <style type="text/css"> #wxf { FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#97FF98); height: 25px; } </style>
  • 探索JUnit4扩展：断言语法assertThat bijian1013 java单元测试assertThat
    一.概述         JUnit 设计的目的就是有效地抓住编程人员写代码的意图，然后快速检查他们的代码是否与他们的意图相匹配。 JUnit 发展至今，版本不停的翻新，但是所有版本都一致致力于解决一个问题，那就是如何发现编程人员的代码意图，并且如何使得编程人员更加容易地表达他们的代码意图。JUnit 4.4 也是为了如何能够
  • 【Gson三】Gson解析{"data":{"IM":["MSN","QQ","Gtalk"]}} bit1129 gson
      如何把如下简单的JSON字符串反序列化为Java的POJO对象? {"data":{"IM":["MSN","QQ","Gtalk"]}}   下面的POJO类Model无法完成正确的解析：   import com.google.gson.Gson;
  • 【Kafka九】Kafka High Level API vs. Low Level API bit1129 kafka
    1. Kafka提供了两种Consumer API High Level Consumer API Low Level Consumer API(Kafka诡异的称之为Simple Consumer API，实际上非常复杂) 在选用哪种Consumer API时，首先要弄清楚这两种API的工作原理，能做什么不能做什么，能做的话怎么做的以及用的时候，有哪些可能的问题  
  • 在nginx中集成lua脚本：添加自定义Http头，封IP等 ronin47 nginx lua
    Lua是一个可以嵌入到Nginx配置文件中的动态脚本语言，从而可以在Nginx请求处理的任何阶段执行各种Lua代码。刚开始我们只是用Lua 把请求路由到后端服务器，但是它对我们架构的作用超出了我们的预期。下面就讲讲我们所做的工作。 强制搜索引擎只索引mixlr.com Google把子域名当作完全独立的网站，我们不希望爬虫抓取子域名的页面，降低我们的Page rank。 location /{
  • java-归并排序 bylijinnan java
    import java.util.Arrays; public class MergeSort { public static void main(String[] args) { int[] a={20,1,3,8,5,9,4,25}; mergeSort(a,0,a.length-1); System.out.println(Arrays.to
  • Netty源码学习-CompositeChannelBuffer bylijinnan javanetty
    CompositeChannelBuffer体现了Netty的“Transparent Zero Copy” 查看API（ http://docs.jboss.org/netty/3.2/api/org/jboss/netty/buffer/package-summary.html#package_description） 可以看到，所谓“Transparent Zero Copy”是通
  • Android中给Activity添加返回键 hotsunshine Activity
    // this need android:minSdkVersion="11" getActionBar().setDisplayHomeAsUpEnabled(true); @Override public boolean onOptionsItemSelected(MenuItem item) {
  • 静态页面传参 ctrain 静态
    $(document).ready(function () { var request = { QueryString : function (val) { var uri = window.location.search; var re = new RegExp("" + val + "=([^&?]*)", &
  • Windows中查找某个目录下的所有文件中包含某个字符串的命令 daizj windows查找某个目录下的所有文件包含某个字符串
    findstr可以完成这个工作。   [html]  view plain copy   >findstr /s /i "string" *.*   上面的命令表示，当前目录以及当前目录的所有子目录下的所有文件中查找"string&qu
  • 改善程序代码质量的一些技巧 dcj3sjt126com 编程PHP重构
    有很多理由都能说明为什么我们应该写出清晰、可读性好的程序。最重要的一点，程序你只写一次，但以后会无数次的阅读。当你第二天回头来看你的代码 时，你就要开始阅读它了。当你把代码拿给其他人看时，他必须阅读你的代码。因此，在编写时多花一点时间，你会在阅读它时节省大量的时间。让我们看一些基本的编程技巧：    尽量保持方法简短    尽管很多人都遵
  • SharedPreferences对数据的存储 dcj3sjt126com
    SharedPreferences简介：                                                   &nbs
  • linux复习笔记之bash shell (2) bash基础 eksliang bashbash shell
    转载请出自出处： http://eksliang.iteye.com/blog/2104329 1.影响显示结果的语系变量（locale）  1.1locale这个命令就是查看当前系统支持多少种语系，命令使用如下： [root@localhost shell]# locale LANG=en_US.UTF-8 LC_CTYPE="en_US.UTF-8"
  • Android零碎知识总结 gqdy365 android
    1、CopyOnWriteArrayList add(E) 和remove(int index)都是对新的数组进行修改和新增。所以在多线程操作时不会出现java.util.ConcurrentModificationException错误。 所以最后得出结论：CopyOnWriteArrayList适合使用在读操作远远大于写操作的场景里，比如缓存。发生修改时候做copy，新老版本分离，保证读的高
  • HoverTree.Model.ArticleSelect类的作用 hvt Web.netC#hovertreeasp.net
    ArticleSelect类在命名空间HoverTree.Model中可以认为是文章查询条件类，用于存放查询文章时的条件，例如HvtId就是文章的id。HvtIsShow就是文章的显示属性，当为-1是，该条件不产生作用，当为0时，查询不公开显示的文章，当为1时查询公开显示的文章。HvtIsHome则为是否在首页显示。HoverTree系统源码完全开放，开发环境为Visual Studio 2013
  • PHP 判断是否使用代理 PHP Proxy Detector 天梯梦 proxy
    1. php 类 I found this class looking for something else actually but I remembered I needed some while ago something similar and I never found one. I'm sure it will help a lot of developers who try to
  • apache的math库中的回归——regression（翻译） lvdccyb Mathapache
    这个Math库，虽然不向weka那样专业的ML库，但是用户友好，易用。 多元线性回归，协方差和相关性（皮尔逊和斯皮尔曼），分布测试（假设检验，t，卡方，G），统计。   数学库中还包含，Cholesky，LU，SVD，QR，特征根分解，真不错。   基本覆盖了：线代，统计，矩阵， 最优化理论 曲线拟合 常微分方程 遗传算法（GA）， 还有3维的运算。。。
  • 基础数据结构和算法十三：Undirected Graphs (2) sunwinner Algorithm
      Design pattern for graph processing. Since we consider a large number of graph-processing algorithms, our initial design goal is to decouple our implementations from the graph representation
  • 云计算平台最重要的五项技术 sumapp 云计算云平台智城云
    云计算平台最重要的五项技术 1、云服务器 云服务器提供简单高效，处理能力可弹性伸缩的计算服务，支持国内领先的云计算技术和大规模分布存储技术，使您的系统更稳定、数据更安全、传输更快速、部署更灵活。 特性 机型丰富 通过高性能服务器虚拟化为云服务器，提供丰富配置类型虚拟机，极大简化数据存储、数据库搭建、web服务器搭建等工作； 仅需要几分钟，根据CP
  • 《京东技术解密》有奖试读获奖名单公布 ITeye管理员 活动
    ITeye携手博文视点举办的12月技术图书有奖试读活动已圆满结束，非常感谢广大用户对本次活动的关注与参与。  12月试读活动回顾： http://webmaster.iteye.com/blog/2164754 本次技术图书试读活动获奖名单及相应作品如下： 一等奖（两名） Microhardest：http://microhardest.ite
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他