phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
网站测速
小皮面板
智能dns
搜索
首页
PHP教程
jQuery Attributes(属性)的使用(一、属性篇)
jQuery Attributes(属性)的使用(一、属性篇)
本篇讲解:attr(name),attr(properties),attr(key,value),attr(key,fn),removeAttr(name)的用法。
您对本系列文章有任何建议或意见请发送到邮箱:sjzlgt@qq.com
您可以到jQuery官网来学习更多的有关jQuery知识。
下面的代码,运行后,需要刷新下。
jQuery-Attributes-1
jQuery-Attributes(属性)的使用(一、属性篇)
本系列文章主要讲述jQuery框架的属性(Attributes)使用方法,我将以实例方式进行讲述,以简单,全面为基础,不会涉及很深,文章分为:属性篇、类篇、Html代码篇&文本篇、值篇共4篇文章。
本篇讲解:attr(name),attr(properties),attr(key,value),attr(key,fn),removeAttr(name)的用法。
您对本系列文章有任何建议或意见请发送到邮箱:sjzlgt@qq.com
您可以到jQuery官网来学习更多的有关jQuery知识。
版权所有:code-cat 博客:http://www.cnblogs.com/bynet 转载请保留原作者、出处和版权信息!
在IE6/7/8、火狐下测试过了,效果都行实现。
1. attr(name)用法
定义:取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。
返回值:Object
参数:name (String) : 属性名称
实例:将ID为"div_a1"的DIV中第一张图片的路径、ID、Name、宽度、Alt、Value属性的值输出到ID为'div_a1_1'的DIV中。
代码:
$("#div_a1_1").append('<span style="color:Red;"><strong>图片数量:$("#div_a1 img")获取到'+$("#div_a1 img").size()+'张图片</strong></span><br />');
$("#div_a1_1").append('第一张图片路径:'+$("#div_a1 img").attr("src")+'<br />');
$("#div_a1_1").append('第一张图片ID:'+$("#div_a1 img").attr("id")+'<br />');
$("#div_a1_1").append('第一张图片Name:'+$("#div_a1 img").attr("name")+'<br />');
$("#div_a1_1").append('第一张图片框宽度:'+$("#div_a1 img").attr("width")+'<br />');
$("#div_a1_1").append('第一张图片框alt:'+$("#div_a1 img").attr("alt")+'<br />');
$("#div_a1_1").append('<span style="color:Red;"><strong>第一个图片框Value值:'+$("#div_a1 img").attr("Value")+'</strong></span><br />');
//点击按钮一看效果
DIV ID="div_a1"
id="div_a1_1"
你可以试着将上面那个文本框的属性值输出
注意:选择器$("#div_a1 img")获取到了2张图片,而att(name)只得到第一张图片的属性值。img元素没有value属性,所以最后输出'undefined'。
2. attr(properties)用法
定义:将一个"名/值"形式的对象设置为所有匹配元素的属性。
这是一种在所有匹配元素中批量设置很多属性的最佳方式。 注意,如果你要设置对象的class属性,你必须使用'className' 作为属性名。 或者你可以直接使用.addClass( class ) 和 .removeClass( class ).
返回值:jQuery
参数:properties (Map) : 作为属性的"名/值对"对象
实例:将ID为"div_b1"的DIV中为所有图像设置src和alt属性。
代码:
$("#div_b1 img:eq(0)").attr({ src: "/upload/2009-12/20091214233425668.gif", alt: "Google" });
$("#div_b1 img:eq(1)").attr({ src: "/upload/2009-12/20091214233425172.gif", alt: "雅虎" });
//点击按钮二看效果
DIV ID="div_b1"
3. attr(key,value)用法
定义:为所有匹配的元素设置一个属性值。
返回值:jQuery
参数:key (String) : 属性名称 value (Object) : 属性值
实例:将ID为"div_c1"的DIV中为所有图像设置src属性。
代码:
$("#div_c1 img:eq(0)").attr("src","/upload/2009-12/20091214233425668.gif");
$("#div_c1 img:eq(1)").attr("src","/upload/2009-12/20091214233425172.gif");
//点击按钮三看效果
DIV ID="div_c1"
4. attr(key,fn)用法
定义:为所有匹配的元素设置一个计算的属性值。不提供值,而是提供一个函数,由这个函数计算的值作为属性值。
返回值:jQuery
参数:key (String) : 属性名称 fn (Function) : 返回值的函数 范围:当前元素, 参数: 当前元素的索引值
实例:将ID为"div_d1"的DIV中为所有图像把title属性的值设置为src属性的值。
代码:$("#div_d1 img").attr("src", function() { return this.title;});
//点击按钮四看效果
DIV ID="div_d1"
5. removeAttr(name)用法
定义:从每一个匹配的元素中删除一个属性。
返回值:jQuery
参数:name (String) : 要删除的属性名
实例:将ID为"div_e1"的DIV中为把所有图像src属性删除 。
代码:$("#div_e1 img").removeAttr("src");
//点击按钮五看效果
DIV ID="div_e1"
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
完整代码打包下载
«
»
PHP教程
PHP简介
PHP基本语法
PHP类型
PHP变量
PHP运算符
PHP控制结构
PHP函数
PHP类与对象
PHP异常处理
函数库分类
快速导航
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
Linux
Mac
ASP
服务器
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
SQLite
wamp
交通频道
Copyright © 2016 phpStudy | 豫ICP备2021030365号-3