jquery 操作css 选择器
.addClass()
为每个匹配的元素添加指定的样式类名
.addClass(className)
className 为每个匹配元素所有增加的一个或多个样式名
.addClass(function(index,currentClass))
函数返回一个或者多个用空格隔开, index 表示参数匹配中的索引位置 this 指向匹配元素集合中的当前元素。
$("p").addClass("myClass yourClass"); 给p 这个元素添加这两个类名样式。
$("ul li:last").addClass(function(index){
return "item-"+index;
}) 在最后一个<li> 元素上加上“item-1”样式。
.css()
获取匹配元素集合中的第一个元素的样式属性计算值或设置每一个匹配元素的一个或多个
css属性。
.css(propertyName)
propertyName 一个css 属性名 。 一个或者多个css 属性组成的数组。
$(this).css("background-color"); 获取当前元素的背景颜色。
$(this).css(["width","height",color]) 获取当前元素的 宽 高 字体颜色。
.css(propertyName,value)
propertyName 一个css 属性名。
value 设置这个css 的属性值。
.css(propertyName,function)
propertyName 一个css 属性名。
function 一个用来返回设置值的函数。this,是当前元素。
$('div.example').css('width',function(index){
return index*50;
}) 设置一个匹配元素的宽度增加到较大的值。
$("p").mouseover(function(){
$(this).css("color","red");
}) 当鼠标经过p 元素时文字变成红色。
$("#box").one("click",function(){
$(this).css("width","+=200")
}) 增加#box 的宽度为200像素。
.hasClass()
确定任何一个匹配的元素是否有被分配给定的(样式类)
.hasClass(className)
className 要查询的样式名。
$("#mydiv").hasClass("foo") 匹配的元素是否含有 foo这个样式
如果有这个样式那么就返回true 如果没有那么就返回false
.removeClass()
移除匹配的元素上面的样式。
.removeClass([className])
每个匹配元素移除的一个或者多个用空格隔开的样式名。
$("p").removeClass("myClass yourClass")
.removeClass(function(index,class))
一个函数,返回一个或多个要移除的元素,index 所有匹配的元素集合中的当前的元素。
.toggleClass()
在匹配的元素集合中的每个元素上切换样式名
.toggleClass(className)
className 在匹配的元素集合中的每个元素上用来切换的一个或多个(用空格隔开)样式类名。
.toggleClass(className,switch)
switch 一个布尔值,用于判断样式是否应该被添加或移除。
.toggleClass([switch])
switch 一个用来判断样式类天添加还是移除的布尔值。
$('#foo').toggleClass(className,add0rRemove) 就等同于
if(add0rRemove){
$('#foo').addClass(className);
}else{
$('#foo').removeClass(className)
}
$("p").click(function(){
$(this).toggleClass("highlight");
//点击当前的p 标签的时候切换样式。
})
jquery 操作css 选择器的更多相关文章
- JQuery:JQuery操作CSS类
JQuery:CSS类jQuery - 获取并设置 CSS 类,通过 jQuery,可以很容易地对 CSS 元素进行操作.jQuery 操作 CSSjQuery 拥有若干进行 CSS 操作的方法.我们 ...
- jQuery操作css样式
jQuery操作css样式 css操作的分类: css操作 位置操作 尺寸操作 css操作之css css代码: html代码: jQuery代码: 效果如下: css操作之位置操作 css代码: h ...
- jquery操作css样式的方法
jquery操作css样式的方法(设置和获取)
- jQuery 操作 CSS
jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - 向被选元素添加一个或多个类 removeClass() - 从被选元素删除一个或多个类 toggleCl ...
- JQUERY操作css与css()方法、获取设置尺寸;
一.jQuery addClass() 方法 向不同的元素添加 class 属性.在添加类时,您也可以选取多个元素 <style> .aa { color:red; }; </sty ...
- jquery操作CSS样式全记录
$(this).click(function(){ if($(this).hasClass(“zxx_fri_on”)){ $(this).removeClass(“zxx_fri_on”); ...
- jQuery操作css
jQuery addClass() 方法 向被选中元素添加class属性,参数为属性值 $("div").addClass("imp"); 也可以同时向多个元素 ...
- Jquery操作属性选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Jquery操作层级选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- jemeter排至数据库时报:Access denied for user 'root'@'localhost' (using password:YES) 解决方案
相信这个问题大部分人都遇到过,至少我遇到过三次了,而且每次原因都不一样,前段时间同学也遇到这个问题,问我怎么解决,我把我的解决思路都说了一遍,发现还不行,最后居然是另外一个原因...哎,说多了都是泪, ...
- org.apache.subversion.javahl.ClientException: Working copy is not up-to-date
之前因为将项目中的一个文件删除了,然后添加了新的文件,svn提交的时候报错. 提示:Working copy is not up-to-date 解决办法:对应的项目上右键然后选择team,然后选择u ...
- RadControl使用相同的Theme
我們僅須對兩個地方加一些程式碼,就可使所有的RadControl擁用相的Theme,如此一下不但可使Ap內布景主題一致,設計者亦不需要對每個控件做字型,顏色,大小等等瑣碎的設計. App.Xaml.c ...
- (七)使用jedis连接单机和集群(一步一个坑踩出来的辛酸泪)
环境准备: redis-4.0.9,最新版了 ruby:redis-x.x.x.gem 这个gem什么版本都行,我redis4用3.0.0的gem正常跑 jedis-2.9.0.jar,最新版 ...
- DEDE利用Ajax实现调用当前登录会员的信息简要说明
其实这个功能在dede默认的模板上就有,只能算是在原有的功能上进行改造而已. 1.首先需要加载一个ajax的js文件进来 <script language="javascript&qu ...
- grunt项目构建
最近想把项目里添加grunt,说白了就是前端自动化管理,具体配置如下: 用到以下几个部件: grunt-contrib-cssmin grunt-contrib-uglify grunt-contri ...
- spring mvc改造成spring boot
一.新增依赖: <dependency> <groupId>org.springframework.boot</groupId> <artifactId> ...
- FAT12格式的引导区实现
org 07c00h ;================================================ jmp short START nop ; 这个 nop 不可少 ;这个结构将 ...
- 【从业余项目中学习1】C# 实现XML存储用户名密码(MD5加密)
最近在写一个C#的项目,用户需求是实现Winform的多文档界面与Matlab算法程序之间的交互.做了一段时间发现,这既能利用业余时间,实战中也可学习一些技术,同时刚毕业也增加一份收入.所以后面会不断 ...
- python模块介绍和 import本质
模块的定义: 用来从逻辑上组织python代码(变量,函数,类,逻辑:实现一个功能),本质上就是.py结尾的python文件. 包的定义: 用来从逻辑上组织模块的,本质上就是一个目录.(必须有一个__ ...