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 ...
随机推荐
- IDEA调试javaScript
谈起JavaScript调试,大家可能想到的就是FireFox下的FireBug,这毫无疑问,FireBug基本已经成为JavaScript开发人员的必备工具.在本文中,将向大家介绍如 ...
- display:flex
元素在x方向走,元素y不一样[高度].可以用对齐.align-items. align-self 自身调节元素在x方向走,元素在x方向距离.justify-content . 元素在x方向走,x方 ...
- TOP 10开源的推荐系统简介
最近这两年推荐系统特别火,本文搜集整理了一些比较好的开源推荐系统,即有轻量级的适用于做研究的SVDFeature.LibMF.LibFM等,也有重量级的适用于工业系统的 Mahout.Oryx.Eas ...
- sql alter表字段处理
--添加字段 ALTER table WCOLLECTION add CLT_ID int null default(0) --将已有字段类型为 NULL 修改为 NOT NULLalter tabl ...
- Lib New
gacutil /if E:\ThirdParty\RockyLib\Rocky\bin\Release\Rocky.dll gacutil /u Rocky partial class GmailF ...
- Git搭建团队开发环境操作演练
模拟创建远程git仓库 1.首先创建如下目录结构: /Users/hujh/Desktop/GitTest2/GitServer/weibo weibo是我们要创建的项目 2.切换目录 $ cd /U ...
- git——学习笔记(二)远程仓库
GIT杀手锏之一——远程仓库 拥有远程仓库的两个办法 1:搭一个Git服务器 2:在GitHub上免费托管的Git仓库 本地仓库 远程仓库 一.在GitHub上免费托管的Git仓库 电脑: 1. ...
- hdu1506 dp
//Accepted 1428 KB 62 ms // #include <cstdio> #include <cstring> #include <iostream&g ...
- 找不到库文件地址,修改修改方法framework
直接双击地址行修改
- Interview----First single charactor
题目:在一个字符串中找到第一个只出现一次的字符.如输入 abaccdeff,则输出 b. 分析:这道题是 2006 年 google 的一道笔试题. 分析: 用 Hash, 时间和空间复杂度是 O(N ...