实例

向第一个 p 元素添加一个类：

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

  $("p:first").addClass("intro");

});

定义和用法

addClass() 方法向被选元素添加一个或多个类。

该方法不会移除已存在的 class 属性，仅仅添加一个或多个 class 属性。

提示：如需添加多个类，请使用空格分隔类名。

语法

$(selector).addClass(class)
参数 描述
class 必需。规定一个或多个 class 名称。

　

使用函数来添加类

使用函数向被选元素添加类。

语法

$(selector).addClass(function(index,oldclass))

$(document).ready(function(){

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

    $("p:first").addClass("intro note");

  });

});

removeClass() 方法 实例

移除所有 <p> 的 "intro" 类：

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

  $("p:first").removeClass("intro");

});

<html>

<head>

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

<script type="text/javascript">

$(document).ready(function(){

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

      $('ul li').removeClass(function() {

      return 'listitem_' + $(this).index();

    });

  });

});

</script>

<style type="text/css">

.listitem_1, .listitem_3

{

color:red;

}

.listitem_0, .listitem_2

{

color:blue;

}

</style>

</head>

<body>

<h1 id="h1">This is a heading</h1>

<ul>

<li class="listitem_0">Apple</li>

<li class="listitem_1">IBM</li>

<li class="listitem_2">Microsoft</li>

<li class="listitem_3">Google</li>

</ul>

<button>删除列表项中的类</button>

</body>

</html>　　

jQuery 属性操作 - addClass() 和 removeClass() 方法的更多相关文章

  1. jQuery 属性操作 - addClass() 方法

    使用 addClass() 和 removeClass() 来移除 class,并添加新的 class. <html> <head> <script type=" ...

  2. 原生js模拟jquery中的addClass和removeClass方法

    js代码: //添加类 function addClass(obj,className) { if(obj.className == '') { //如果没有class obj.className = ...

  3. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  4. 【转发】JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...

  5. jQuery属性操作（四）

    通过阅读jQuery为属性操作封装的基本方法和为处理兼容性问题提供的hooks,发现jQuery在属性操作方面并没有做过多的设计,只是处理一下兼容性问题,然后调用基础的DOM操作方法.以下是对JQue ...

  6. jquery——属性操作、特殊效果

    1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...

  7. jQuery 属性操作 - val() 方法

    val() 方法返回或设置被选元素的值. 元素的值是通过 value 属性设置的.该方法大多用于 input 元素. 如果该方法未设置参数,则返回被选元素的当前值. <html> < ...

  8. jQuery 属性操作 - attr() 方法

    定义和用法 attr() 方法设置或返回被选元素的属性值. 根据该方法不同的参数,其工作方式也有所差异. 实例1 设置被选元素的属性和值. <html><head><sc ...

  9. jQuery属性操作

    jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...

随机推荐

  1. sass变量

    sass变量用法 1.sass变量必须以$符开头,后面紧跟着变量名 2.变量值和变量名之间就需要使用冒号(:)分隔开(就像CSS属性设置一样) 3.如果值后面加上!default则表示默认值 默认变量 ...

  2. Redis 实现分布式锁

    前言 分布式锁一般有三种实现方式:1. 数据库乐观锁:2. 基于Redis的分布式锁:3. 基于ZooKeeper的分布式锁.本篇博客将介绍第二种方式,基于Redis实现分布式锁.虽然网上已经有各种介 ...

  3. 【创客+】偷心锁屏创始人Jerry创业心得分享

    偷心锁屏创始人Jerry创业心得分享 作者:Jerry权泉,偷心锁屏创始人 我创业的起因非常偶然.08年在东京早稻田大学读博士期间,每周六都去社区活动中心跟日本人志愿者日语对话练习日语.有一次练习结束 ...

  4. canvas.addEventListener()

    对 canvas 元素的事件监听用addEventListener()实现, 但是有一点缺陷是:canvas 不支持键盘事件,为了解决这个问题,可以采用以下两种方案: 方案一: key event - ...

  5. geoserver 知识小计

    http://localhost:8888/geoserver/wms?service=WMS&request=GetCapabilities 这个地址用于获取发布的WMS服务的属性,用于获取 ...

  6. Linux ->> UBuntu 14.04 LTE下主机名称和IP地址解析

    UBuntu 14.04 LTE下主机名称和IP地址解析一些相关的配置文件: /etc/hosts: 主机文件.手工配置IP地址和主机名称间的映射.格式为每行一条映射条项: <machine_n ...

  7. c# 知识学习

    1.C#基础知识梳理系列 2.详解C#委托,事件与回调函数 3.C#制作Windows service

  8. Struts学习-Hibernate2

    一. 1.配置 <!-- hibernate-core --> <dependency> <groupId>org.hibernate</groupId> ...

  9. HTTP常用状态码大全

    HTTP状态码对照表 HTTP response codes 当浏览者访问一个网页时,浏览者的浏览器会向网页所在服务器发出请求.当浏览器接收并显示网页前,此网页所在的服务器会返回一个包含HTTP状态码 ...

  10. July 02nd 2017 Week 27th Sunday

    No safe wading in an unknown water. 未知水深浅,涉水有危险. Is this the theory that has been the guideline for ...