attr() - jQuery

说明

1.优点

方便：可以直接在jQuery对象上调用并链接到其他jQuery方法。
跨浏览器一致性：一些属性的值在浏览器之间报告不一致，甚至跨单一浏览器的版本报告。该.attr()方法减少了这种不一致。

2. 获取匹配元素集合中第一个元素的属性值

当然你也可以通过循环获取第二个第三个的属性值。
简单的说就是除了style样式，其他属性可以通过attr添加或者修改。

.attr(attributeName)

值为String字符类型

3. 或为每个匹配元素设置一个或多个属性。属性指src、name，value等。

![](test.jpg)

修改特性：

$('#test').attr("alt","none");
$('#test').attr({
  alt:"none",
  src:"a.jpg"
});

增加特性：

$('#test').attr("herf","mytest");
$('#test').attr("title","mytest")

通过使用函数设置属性，您可以根据元素的其他属性计算值。例如，要将新值与现有值相连：

$( "#greatphoto" ).attr( "title", function( i, val ) {
  return val + " - photo by Kelly Clark";
});

i为当前值，val为当前特性

为页面中的所有<img>设置一些属性。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>attr demo</title>
  <style>
  img {
    padding: 10px;
  }
  div {
    color: red;
    font-size: 24px;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 <img>
<img>
<img>
<div><b>Attribute of Ajax</b></div>
<script>
$( "img" ).attr({
  src: "/resources/hat.gif",
  title: "jQuery",
  alt: "jQuery Logo"
});
$( "div" ).text( $( "img" ).attr( "alt" ) );
</script>
</body>
</html>

a.png

对比css()

css()可以设置和添加css属性。attr()可以通过固有特性来改变样式，不能“无中生有”。
通常来讲样式由css()负责。