JQ添加移除css样式--转载 心存善念
我们常常要使用Javascript来改变页面元素的样式。其中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的classname特性来实现的;而jQuery里提供三种方法来实现这个功能,虽然它们和传统方法的思想相通,但是却节省了许多代码。还是那句话 - “jQuery让JavaScript代码变得简洁!”
1. addClass() - 添加CSS类
$("#target").addClass("newClass");
//#target 指的是需要添加样式的元素的ID
//newClass 指的是CSS类的名称
2. removeClass() - 移除CSS类
$("#target").removeClass("oldClass");
//#target 指的是需要移除CSS类的元素的ID
//oldClass 指的是CSS类的名称
3. toggleClass() - 添加或者移除CSS类:如果CSS类已经存在,它将被移除;相反,如果CSS类不存在,它将被加上。
$("#target").toggleClass("newClass")
//如果ID为“target”的元素已经定义了CSS样式,它将被移除;
//反之,CSS类”newClass“将被赋给该ID。
在实际运用中,我们常常先定义好这些CSS类,然后通过Javascript事件触发(比如点击某个链接)来改变页面元素样式。此外,jQuery还提供一种方法 hasClass("className")用来判断某个元素是否已经被赋予某个CSS类。
常见问题:
<label for="TrueName" generated="true" class="msg-error" style="">正确</label>
通过addClass("msg-success");
<label for="TrueName" generated="true" class="msg-error msg-success" style="">正确</label>
JQ添加移除css样式--转载 心存善念的更多相关文章
- JQ添加移除css样式
1. addClass() - 添加CSS类 $("#target").addClass("newClass"); //#target 指的是需要添加样式的元素 ...
- 如何添加/移除CSS类
在网页设计中,我们常常要使用Javascript来改变页面元素的样式.其中一种办法是改变页面元素的CSS类(Class),这在传统的Javascript里,我们通常是通过处理HTML Dom的clas ...
- jQuery动态追加移除CSS样式
jQuery基础知识,动态添加删除CSS样式 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- jQuery 动态添加、删除css样式
1.addClass css中: <style type="text/css"> .chColor {background: #267cb7;color:w ...
- TP5.1 分页CSS样式(转载)
效果如图: 1.在extend\目录下创建page目录,在page目录中创建Page.php文件,将以下代码放入文件中 <?php namespace page; use think\Pagin ...
- jquery 给指定li添加制定的css样式
$("ul li").eq(1).css({"color":"red"}); //第二个li $("ul li").eq ...
- jq修改多个css样式
$("#xxx").css({"属性名称": "属性值", "属性名称": "属性值" });
- salesforce linghtning component 自动添加标准style css样式
Your app automatically gets Lightning Design System styles if it extends force:slds <aura:applic ...
- jQuery动态添加删除CSS样式
jQuery框架提供了两个CSS样式操作方法,一个是追加样式addClass,一个是移除样式removeClass,下面通过一个小例子讲解用法. jQuery动态追加移除CSS样式 <!DOCT ...
随机推荐
- 戴文的Linux内核专题:08内核配置(4)
转自Linux中国 这个第四部分里,我们将继续配置更多的设置和特性. 这里我们被问及关于"IBM Calgary IOMMU support (CALGARY_IOMMU)".这个 ...
- java udp网络编程
import java.net.*; /* 通过UDP传输发送文字数据 1.建立socket服务 2.提供数据,并封装到数据包中 3.通过sokect服务的发送功能,将数据包发送出去 4.关闭资源 * ...
- java 基本类库包的作用
tools.jar:工具类库,它跟我们程序中用到的基础类库没有关系. Jre库包含的jar文件(jdk1.6):resources.jar.rt.jar.jsse.jar.jce.jar.charse ...
- JEvaluator Jscript.net
using Microsoft.JScript; using System; using System.CodeDom.Compiler; using System.Collections.Gener ...
- (转)phoneGap-Android开发环境搭建
(原)http://www.cnblogs.com/shawn-xie/archive/2012/08/15/2638480.html phoneGap-Android开发环境搭建 一.安装 在安 ...
- jqGrid详解及高级应用(十四)
一:jqGrid 是一个用来显示网格数据的jQuery插件,文档比较全面,附带中文版本. 二:官方主页http://www.jqgrid.com/目前最新版本:jqGrid 3.7 Beta在线文档 ...
- Inno Setup的常用脚本
Inno Setup的常用脚本 分类: VC++神奇理论 2012-12-06 10:07 3234人阅读 评论(2) 收藏 举报 安装不同的目录: [Files] Source: "我的程 ...
- Unity3d Shader
Unity3d Shader 预览Surface Shader主要用来实现光照相关处理,可能更简洁. Vertex and Fragment Shader 如果不与光照交互, 则可以用这个shader ...
- Ecshop安装过程中的的问题:cls_image::gd_version()和不支持JPEG
在安装Ecshop的时候,遇到两个问题: 1.Strict Standards: Non-static method cls_image::gd_version() should not be cal ...
- iOS-申请开发证书流程
1.开发者证书(分为开发和发布两种,类型为ios Development,ios Distribution),这个是最基础的,不论是真机调试,还是上传到appstore都是需要的,是一个基证书,用来证 ...