jQuery中 attr() 方法使用小结

 　　jquery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写，在jQuery DOM操作中会经常用到attr()

　　定义和用法

　　attr() 方法设置或返回被选元素的属性值。

　　根据该方法不同的参数，其工作方式也有所差异。

　　实例1

　　设置被选元素的属性和值。

　　?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("img").attr("width","180");
});
});
</script>
</head>
<body>
<img src="/i/eg_smile.gif" />
<br />
<button>设置图像的 width 属性</button>
</body>
</html>

　　实例2

　　返回被选元素的属性值。

　　?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert("Image width " + $("img").attr("width"));
});
});
</script>
</head>
<body>
<img src="/i/eg_smile.gif" width="128" height="128" />
<br />
<button>返回图像的宽度</button>
</body>
</html>

　　以上所述就是本文的全部内容了，希望大家能够喜欢。

时间： 2024-10-02 05:30:34

jQuery中 attr() 方法使用小结的相关文章

jQuery中 attr() 方法使用小结_jquery

定义和用法 attr() 方法设置或返回被选元素的属性值. 根据该方法不同的参数,其工作方式也有所差异. 实例1 设置被选元素的属性和值. <html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).re

jQuery中attr()方法用法实例_jquery

本文实例讲述了jQuery中attr()方法用法.分享给大家供大家参考.具体分析如下: 此方法设置或返回匹配元素的属性值. attr()方法根据参数的不同,功能也不同. 语法结构一:获取第一个匹配元素指定属性的属性值. 复制代码 代码如下: $(selector).attr(name) 参数列表: 参数 描述 name 定义要获取其值的属性名称. 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charse

jQuery使用attr()方法同时设置多个属性值用法实例

 这篇文章主要介绍了jQuery使用attr()方法同时设置多个属性值的用法,实例分析了jQuery中attr方法实现多个属性设置的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了jQuery使用attr()方法同时设置多个属性值的用法.分享给大家供大家参考.具体如下: 下面这个演示例子可通过点击按钮实现修改链接与提示的功能. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <!DOCTYPE html

jQuery中attr()与prop()函数用法实例详解(附用法区别)_jquery

本文实例讲述了jQuery中attr()与prop()函数用法.分享给大家供大家参考,具体如下: 一.jQuery的attr()方法 jquery中用attr()方法来获取和设置元素属性,attr是attribute(属性)的缩写,在jQuery DOM操作中会经常用到attr(),attr()有4个表达式. 1. attr(属性名) //获取属性的值(取得第一个匹配元素的属性值.通过这个方法可以方便地从第一个匹配元素中获取一个属性的值.如果元素没有相应属性,则返回 undefined ) 2.

JQuery中attr方法和removeAttr方法用法实例

  本文实例讲述了JQuery中attr方法和removeAttr方法用法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:

JQuery中attr方法和removeAttr方法用法实例_jquery

本文实例讲述了JQuery中attr方法和removeAttr方法用法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"

Jquery中ajax方法data参数的用法小结

 本篇文章主要是对Jquery中ajax方法data参数的用法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助  代码如下: $.ajax({    type: "POST",    url: "some.php",    data: "name=John&location=Boston", //第一种方式传参   // data: {name:"John",location:"Boston&qu

jquery中attr和prop的区别分析

 这篇文章主要介绍了jquery中attr和prop的区别分析的相关资料,需要的朋友可以参考下     在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答案很多.这里谈谈我的心得,我的心得很简单: • 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. • 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. 上面的描述也许有点模糊,举几个例子就知道了.

对 jQuery 中 data 方法的误解分析_jquery

今天 谢亮 兄弟和我讨论一个东西的时候,谈到了性能,他用的是 attr 操作自定义属性 data-uid,我说用 data 好,因为是 dataset 实现,然后他去翻了下 jQuery 源码和我说,没有发现这个东西,我就纳闷了.于是我去仔细读了下 data 方法的源码,才发现我一直误会了,再此,向之前问我 data 方法的群友道歉,我 "骗" 了你们,你们来打我吧. 今天我就重新解释下 data 方法,先看下 jQuery 1.11.0 的手册里肿么说的吧,请移步至http://sh