关于jquery中用函数来设置css样式
关于jquery中用函数来设置css样式
2016-12-21 23:27:55
1.jquery语法
$(selector).css(name,function(index,value))
name:必需。规定 CSS 属性的名称
function(index,value):
规定返回CSS属性新值的函数。
- index - 可选。接受选择器的index位置
- value - 可选。接受CSS属性的当前值
2.function(index,value)的用途
相当于对通过选择符“selector”选择到的所有对象进行一次遍历,并设置相应的css属性值,其中index和value这两个参数可有可无。
如果直接引用已有的函数,如下:
//函数colorStr()为td标签的背景色提供一个随机的背景色
$("td").css("background-color",colorStr());
//上面的代码就相当于直接给所有td背景色赋同一个颜色值,就像下面的代码
$("td").css("background-color","green");
以上情况不会遍历td对象,而会将所有的td设置成一样的颜色,如下图,都变成了绿色

如果通过function遍历就会将每个td背景色设置成不一样的颜色,代码如下:
//通过function函数调用colorStr函数,从而遍历所有的td标签,使每个td的背景色都不一样
$("td").css("background-color",function(){return colorStr()});
效果图如下:

关于jquery中用函数来设置css样式的更多相关文章
- js和jquery设置css样式的几种方法
一.js设置样式的方法 1. 直接设置style的属性 某些情况用这个设置 !important值无效 element.style.height = '50px'; 2. 直接设置属性(只能用于某些 ...
- cssText设置css样式
js中用cssText设置css样式 (2012-08-21 10:40:22) 转载▼ 标签: js 如果网页中一个 id为“no”的标签,暂且当div标签来tell:想要在js中设置这个div ...
- js设置css样式.
在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...
- jQuery修改class属性和CSS样式
jQuery修改class属性和CSS样式 class属性修改 类属性即class属性,规定类名. 用类选择器规定样式的时候,需要为元素指定类名,即class属性的值. 注意每个HTML元素只有一个c ...
- 3.通过js代码设置css样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 5、通过js代码设置css样式
1.页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- DOM设置css样式
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- JS设置CSS样式的几种方式
用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性 某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign) 如果想保 ...
- JS设置CSS样式的几种方式【转】
用JS来动态设置CSS样式,常见的有以下几种 1. 直接设置style的属性 某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign) 如果想保 ...
随机推荐
- HTTP学习二:Web应用中的HTTP
1 HTTP连接 1.1 TCP连接对性能的影响 TCP三次握手如下图: 如上图,建立一次TCP连接要经过三个步骤.HTTP是建立在TCP之上的,因此TCP连接的性能直接影响HTTP的性能. TCP影 ...
- Maven配置Nexus私服
官方文档:http://books.sonatype.com/nexus-book/3.0/reference/maven.html#maven-sect-single-group 1,下载安装 首先 ...
- 用pageGroup.js实现分页功能
1.html页面中 引入 <link rel="stylesheet" type="text/css" href="/stylesheets/p ...
- MVVM 开发的几种模式讨论(WPF)
在WPF系(包括SL,WP或者Win8)应用开发中,MVVM是个老生常谈的问题.初学者可能不会有感觉,但当你写一个核心逻辑能在各种平台上无缝移植,而只需改改UI的时候,那种快感是无法用语言来形容的. ...
- 最好的简明NodeJS学习材料
http://www.nodebeginner.org/index-zh-cn.html http://debuggable.com/posts/understanding-node-js:4bd98 ...
- ELF静态链接
一直对ELF目标文件是怎样链接成可执行文件感到比较的疑惑,ELF文件里面的重定位段是怎样解决符号引用问题的?前几天偶然看了<深入理解计算机系统>里面讲了这个问题,看了之后对里面的实现机制终 ...
- MVC html.actionlink
Html.ActionLink 在 LinkExtensions 类中,ActionLink方法参数说明: 简单来说捏 就是这样滴 参数 类型 ...
- Cesium原理篇:3最长的一帧之地形(4:重采样)
地形部分的原理介绍的差不多了,但之前还有一个刻意忽略的地方,就是地形的重采样.通俗的讲,如果当前Tile没有地形数据的话,则会从他父类的地形数据中取它所对应的四分之一的地形数据.打个比方 ...
- 模拟QQ聊天系统-安卓源代码
利用课余时间随便写的一个小东西,都是一起学习. 先上图: package com.example.nanchen.listviewdemo.adapter; import android.conten ...
- Android四大组件之一“广播”
前言 Android四大组件重要性已经不言而喻了,今天谈谈的是Android中的广播机制.在我们上学的时候,每个班级的教室里都会装有一个喇叭,这些喇叭都是接入到学校的广播室的,一旦有什么重要的通知,就 ...