jquery中用函数来设置css样式


Posted in Javascript onDecember 22, 2016

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设置成一样的颜色,如下图,都变成了绿色

jquery中用函数来设置css样式

如果通过function遍历就会将每个td背景色设置成不一样的颜色,代码如下:

//通过function函数调用colorStr函数,从而遍历所有的td标签,使每个td的背景色都不一样
$("td").css("background-color",function(){return colorStr()});

效果图如下:

jquery中用函数来设置css样式

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript 开发中规范性的一点感想
Jun 23 Javascript
javascript类继承机制的原理分析
Sep 12 Javascript
js window.onload 加载多个函数的方法
Nov 02 Javascript
JSONP 跨域共享信息
Aug 16 Javascript
jQuery 文本框得失焦点的简单实例
Feb 19 Javascript
js实现鼠标移到链接文字弹出一个提示层的方法
May 11 Javascript
Javascript递归打印Document层次关系实例分析
May 15 Javascript
js实现延迟加载的几种方法
Apr 24 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
Dec 13 Javascript
彻底揭秘keep-alive原理(小结)
May 05 Javascript
js实现自动播放匀速轮播图
Feb 06 Javascript
javascript实现简易计算器功能
Sep 23 Javascript
jquery实现(textarea)placeholder自动换行
Dec 22 #Javascript
js数组去重的hash方法
Dec 22 #Javascript
JavaScript生成.xls文件的代码
Dec 22 #Javascript
微信小程序 表单Form实例详解(附源码)
Dec 22 #Javascript
微信小程序 122100版本更新问题解决方案
Dec 22 #Javascript
JS闭包与延迟求值用法示例
Dec 22 #Javascript
jQuery实现两个select控件的互移操作
Dec 22 #Javascript
You might like
PHP与SQL注入攻击防范小技巧
2011/09/16 PHP
php object转数组示例
2014/01/15 PHP
浅析ThinkPHP的模板输出功能
2014/07/01 PHP
thinkPHP实现MemCache分布式缓存功能
2016/03/23 PHP
php利用嵌套数组拼接与解析json的方法
2017/02/07 PHP
php使用ftp实现文件上传与下载功能
2017/07/21 PHP
如何在PHP中读写文件
2020/09/07 PHP
js下通过prototype扩展实现indexOf的代码
2010/12/08 Javascript
JS中的Replace方法使用经验分享
2015/05/20 Javascript
AngularJS ng-blur 指令详解及简单实例
2016/07/30 Javascript
js中常用的Tab切换效果(推荐)
2016/08/30 Javascript
使用bat打开多个cmd窗口执行gulp、node
2017/02/17 Javascript
浅谈Angular4中常用管道
2017/09/27 Javascript
vue中eventbus被多次触发以及踩过的坑
2017/12/02 Javascript
nodejs+mongodb aggregate级联查询操作示例
2018/03/17 NodeJs
小程序tab页无法传递参数的方法
2018/08/03 Javascript
js拖动滑块和点击水波纹效果实例代码
2018/10/16 Javascript
重学JS 系列:聊聊继承(推荐)
2019/04/11 Javascript
tsconfig.json配置详解
2019/05/17 Javascript
vue引入微信sdk 实现分享朋友圈获取地理位置功能
2019/07/04 Javascript
Python六大开源框架对比
2015/10/19 Python
详解python中xlrd包的安装与处理Excel表格
2016/12/16 Python
python函数式编程学习之yield表达式形式详解
2018/03/25 Python
Python使用OpenCV进行标定
2018/05/08 Python
Python基本数据结构之字典类型dict用法分析
2019/06/08 Python
python实现的Iou与Giou代码
2020/01/18 Python
在tensorflow中设置使用某一块GPU、多GPU、CPU的操作
2020/02/07 Python
使用pandas读取表格数据并进行单行数据拼接的详细教程
2021/03/03 Python
娇韵诗俄罗斯官方网站:Clarins俄罗斯
2020/10/03 全球购物
新闻专业个人求职信
2013/12/19 职场文书
运动会跳远广播稿
2014/02/04 职场文书
工作目标责任书
2014/07/23 职场文书
代理人委托书
2014/09/16 职场文书
延安红色之旅心得体会
2014/10/07 职场文书
2015年保险业务员工作总结
2015/05/27 职场文书
中学政教处工作总结
2015/08/13 职场文书