jQuery 使用手册(三)


Posted in Javascript onSeptember 23, 2009

CSS操作

      传统javascript对css的操作相当繁琐,比如<div id="a" style="background:blue">css</div>取它的background语法是 document.getElementById("a").style.background,而jQuery对css更方便的操作,$("#a").background(),$("#a").background(“red”)
$("#a")得到jQuery对象[ <div id="a" … /div> ]
$("#a").background()将取出该对象的background样式。
$("#a").background(“red”)将该对象的background样式设为red
jQuery提供了以下方法,来操作css
background ()   background (val)     color()    color(val)     css(name)    css(prop)   
css(key, value)      float()   float(val)   height()   height(val)  width()  width(val) 
left()   left(val)       overflow()   overflow(val)   position()   position(val)  top()   top(val)


这里需要讲解一下css(name)  css(prop)  css(key, value),其他的看名字都知道什么作用了!

<div id="a" style="background:blue; color:red">css</div><id="b">test</P>

css(name)  获取样式名为name的样式
$("#a").css("color") 将得到样式中color值red,("#a").css("background ")将得到blue

css(prop)  prop是一个hash对象,用于设置大量的css样式
$("#b").css({ color: "red", background: "blue" });
最终效果是<p id="b" style="background:blue; color:red">test</p>,{ color: "red", background: "blue" },hash对象,color为key,"red"为value,

css(key, value)  用于设置一个单独得css样式
$("#b").css("color","red");最终效果是<p id="b" style="color:red">test</p>

Javascript 相关文章推荐
javascript淡入淡出效果的实现思路
Mar 31 Javascript
jquery实现div拖拽宽度示例代码
Jul 31 Javascript
jquery中$.post()方法的简单实例
Feb 04 Javascript
不到30行JS代码实现Excel表格的方法
Nov 15 Javascript
JS实现图片放大镜效果的方法
Feb 27 Javascript
js 点击a标签 获取a的自定义属性方法
Nov 21 Javascript
JS 学习总结之正则表达式的懒惰性和贪婪性
Jul 03 Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
Sep 14 Javascript
JS设计模式之惰性模式(二)
Sep 29 Javascript
Bootstrap3.3.7导航栏下拉菜单鼠标滑过展开效果
Oct 31 Javascript
javascript+jQuery实现360开机时间显示效果
Nov 03 jQuery
javascript解析json格式的数据方法详解
Aug 07 Javascript
jQuery 使用手册(二)
Sep 23 #Javascript
jQuery 使用手册(一)
Sep 23 #Javascript
JavaScript 变量命名规则
Sep 23 #Javascript
js 获取中文拼音,Select自动匹配字母获取值的代码
Sep 23 #Javascript
jquery ajax 登录验证实现代码
Sep 23 #Javascript
比较全面的event对像在IE与FF中的区别 推荐
Sep 21 #Javascript
javascript 必知必会之closure
Sep 21 #Javascript
You might like
PHP下MAIL的另一解决方案
2006/10/09 PHP
PHP has encountered an Access Violation
2007/01/15 PHP
在命令行下运行PHP脚本[带参数]的方法
2010/01/22 PHP
php在数组中查找指定值的方法
2015/03/17 PHP
php将图片文件转换成二进制输出的方法
2015/06/10 PHP
javascript 语法基础 想学习js的朋友可以看看
2009/12/16 Javascript
js获取数组的最后一个元素
2015/04/14 Javascript
jQuery实现带滑动条的菜单效果代码
2015/08/26 Javascript
jQuery实现滚动切换的tab选项卡效果代码
2015/08/26 Javascript
js操作table元素实现表格行列新增、删除技巧总结
2015/11/18 Javascript
JavaScript DOM 学习总结(五)
2015/11/24 Javascript
js简单倒计时实现代码
2016/04/30 Javascript
JavaScript数组操作函数汇总
2016/08/05 Javascript
JS使用贪心算法解决找零问题示例
2017/11/27 Javascript
微信小程序wx:for和wx:for-item的用法详解
2018/04/01 Javascript
layui实现给某一列加点击事件
2019/10/26 Javascript
jQuery实现弹出层效果
2019/12/10 jQuery
谈谈node.js中的模块系统
2020/09/01 Javascript
Kettle中使用JavaScrip调用jar包对文件内容进行MD5加密的操作方法
2020/09/04 Javascript
nuxt 实现在其它js文件中使用store的方式
2020/11/05 Javascript
[04:03]辉夜杯主赛事 12月25日RECAP精彩回顾
2015/12/26 DOTA
Python机器学习算法之k均值聚类(k-means)
2018/02/23 Python
分享一下Python数据分析常用的8款工具
2018/04/29 Python
python中hasattr()、getattr()、setattr()函数的使用
2019/08/16 Python
Python函数默认参数常见问题及解决方案
2020/03/26 Python
Python unittest单元测试框架及断言方法
2020/04/15 Python
CSS3的transition和animation的用法实例介绍
2014/08/20 HTML / CSS
HTML5 表单验证失败的提示语问题
2017/07/13 HTML / CSS
Champion官网:美国冠军运动服装
2017/01/25 全球购物
美国家居装饰店:Pier 1
2019/09/04 全球购物
装潢设计专业推荐信模板
2013/11/26 职场文书
电脑教师的自我评价
2013/12/18 职场文书
数控技术学生的自我评价
2014/02/15 职场文书
八达岭长城导游词
2015/01/30 职场文书
SpringBoot生成License的实现示例
2021/06/16 Java/Android
MySQL中JOIN连接的基本用法实例
2022/06/05 MySQL