jquery 学习之二 属性相关


Posted in Javascript onNovember 23, 2010

attr(name)
取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。
Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element. If the element does not have an attribute with such a name, undefined is returned.
返回值
Object

参数
name (String) : 属性名称

示例
返回文档中第一个图像的src属性值。

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").attr("src");
结果:

test.jpg
---------------------------------------------------------------------------------------------------------------------------------------
attr(properties)
将一个“名/值”形式的对象设置为所有匹配元素的属性。
这是一种在所有匹配元素中批量设置很多属性的最佳方式。 注意,如果你要设置对象的class属性,你必须使用'className' 作为属性名。或者你可以直接使用.addClass( class ) 和 .removeClass( class ).
Set a key/value object as properties to all matched elements.
This serves as the best way to set a large number of properties on all matched elements. Note that you must use 'className' as key if you want to set the class-Attribute. Or use .addClass( class ) or .removeClass( class ).
返回值
jQuery

参数
properties (Map) : 作为属性的“名/值对”对象

示例
为所有图像设置src和alt属性。

HTML 代码:

<img/>
jQuery 代码:

$("img").attr({ src: "test.jpg", alt: "Test Image" });
结果:

[ <img src= "test.jpg" alt:="Test Image" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,value)
为所有匹配的元素设置一个属性值。
Set a single property to a value, on all matched elements.
返回值
jQuery

参数
key (String) : 属性名称

value (Object) : 属性值

示例
为所有图像设置src属性。

HTML 代码:

<img/>
<img/>
jQuery 代码:

$("img").attr("src","test.jpg");
结果:

[ <img src= "test.jpg" /> , <img src= "test.jpg" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,fn)
为所有匹配的元素设置一个计算的属性值。
不提供值,而是提供一个函数,由这个函数计算的值作为属性值。
Set a single property to a computed value, on all matched elements.
Instead of supplying a string value as described 'above', a function is provided that computes the value.
返回值
jQuery

参数
key (String) : 属性名称

fn (Function) : 返回值的函数 范围:当前元素, 参数: 当前元素的索引值

示例
把src属性的值设置为title属性的值。

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").attr("title", function() { return this.src });
结果:

<img src="test.jpg" title="test.jpg" />
---------------------------------------------------------------------------------------------------------------------------------------
removeAttr(name)
从每一个匹配的元素中删除一个属性
Remove an attribute from each of the matched elements.
返回值
jQuery

参数
name (String) : 要删除的属性名

示例
将文档中图像的src属性删除

HTML 代码:

<img src="test.jpg"/>
jQuery 代码:

$("img").removeAttr("src");
结果:

[ <img /> ]

Javascript 相关文章推荐
JavaScript replace(rgExp,fn)正则替换的用法
Mar 04 Javascript
jQuery 选择器项目实例分析及实现代码
Dec 28 Javascript
js 调用父窗口的具体实现代码
Jul 15 Javascript
JS如何判断移动端访问设备并解析对应CSS
Nov 27 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
详解Bootstrap glyphicons字体图标
Jan 04 Javascript
完美实现八种js焦点轮播图(下篇)
Apr 20 Javascript
AngularJS入门教程之控制器详解
Jul 27 Javascript
jQuery插件Echarts实现的渐变色柱状图
Mar 23 jQuery
js学习心得_一个简单的动画库封装tween.js
Jul 14 Javascript
express中static中间件的具体使用方法
Oct 17 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
Jul 19 Javascript
jquery 学习之一 对象访问
Nov 23 #Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
Nov 21 #Javascript
IE6下出现JavaScript未结束的字符串常量错误的解决方法
Nov 21 #Javascript
基于jquery的滑动样例代码
Nov 20 #Javascript
jquery $.ajax()取xml数据的小问题解决方法
Nov 20 #Javascript
简单实用的js调试logger组件实现代码
Nov 20 #Javascript
扩展javascript的Date方法实现代码(prototype)
Nov 20 #Javascript
You might like
javascript some()函数用法详解
2014/11/13 PHP
PHP编程中的__clone()方法使用详解
2015/11/27 PHP
WordPress中获取指定分类及其子分类下的文章数目
2015/12/31 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
JavaScript 使用技巧精萃(.net html
2009/04/25 Javascript
js保留小数点后几位的写法
2014/01/03 Javascript
jQuery实现的多选框多级联动插件
2014/05/02 Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
2014/10/17 Javascript
js操作数据库实现注册和登陆的简单实例
2016/05/26 Javascript
jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
2016/07/27 Javascript
weUI应用之JS常用信息提示弹层的封装
2016/11/21 Javascript
使用ionic播放轮询广告的实现方法(必看)
2017/04/24 Javascript
ng-events类似ionic中Events的angular全局事件
2018/09/05 Javascript
微信小程序云开发实现增删改查功能
2019/05/17 Javascript
JS回调函数深入理解
2019/10/16 Javascript
[14:24]Optic Gaming vs PSG LGD BO3
2018/06/07 DOTA
Python函数嵌套实例
2014/09/23 Python
详解duck typing鸭子类型程序设计与Python的实现示例
2016/06/03 Python
Django rstful登陆认证并检查session是否过期代码实例
2019/08/13 Python
keras绘制acc和loss曲线图实例
2020/06/15 Python
TensorFlow Autodiff自动微分详解
2020/07/06 Python
python绘制分布折线图的示例
2020/09/24 Python
全球最大的跑步用品商店:Road Runner Sports
2016/09/11 全球购物
金智子午JAVA面试题
2015/09/04 面试题
实习生的自我评价
2014/01/08 职场文书
素质拓展感言
2014/01/29 职场文书
设备管理实施方案
2014/05/31 职场文书
公安纪律作风整顿剖析材料
2014/10/10 职场文书
英文版辞职信
2015/02/28 职场文书
人事任命通知书
2015/04/21 职场文书
2015年小学二年级班主任工作总结
2015/05/21 职场文书
公司岗位说明书
2015/10/08 职场文书
2016年国培心得体会及反思
2016/01/13 职场文书
Nginx的rewrite模块详解
2021/03/31 Servers
Golang 结构体数据集合
2022/04/22 Golang
git中cherry-pick命令的使用教程
2022/06/25 Servers