溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“attr怎么使用”的相關知識，小編通過實際案例向大家展示操作過程，操作方法簡單快捷，實用性強，希望這篇“attr怎么使用”文章能幫助大家解決問題。
.attr( attributeName, value )
描述: 設置每一個匹配元素的一個或多個屬性。
attr( attributeName, value )
attributeName
類型: String
要設置值的屬性名
value
類型: String,Number
這個屬性設置的值
attributes
類型: PlainObject
一個 屬性 - 值 集合對象。（譯者注：例如{ alt: '', title: 'WEB前端開發-http://www.css88.com }）
attributeName
類型: String
要設置值的屬性名.
function(index, attr)
類型: Function()
這個函數返回用來設置的值，this指向當前的元素。接收index 參數表示元素在匹配集合中的索引位置和html 參數表示元素上原來的 HTML 內容。
這個 .attr() 方法 是一個設置屬性值的方便而且強大的途徑—特別是當設置多個屬性或使用值來自函數。 讓我們考慮下面的圖片：
<img id="greatphoto" src="brush-seller.jpg" alt="brush seller" />
Setting a simple attribute(設置一個簡單的屬性)
我們可以通過.attr()方法非常簡單的改變 alt 屬性并附上新值：
$('#greatphoto').attr('alt', 'Beijing Brush Seller');
我們可以用同樣的方法 添加 一個屬性：
$('#greatphoto')
.attr('title', 'Photo by Kelly Clark');
Setting several attributes at once(一次設置多個屬性)
同時改變alt 屬性 和 添加 title屬性, 我們可以使用一個“名/值”形式的對象 (JavaScript object literal)傳遞給這個方法。 每個 key-value 對象將增加或者修改一個屬性：
$('#greatphoto').attr({
alt: 'Beijing Brush Seller',
title: 'photo by Kelly Clark'
});
當設置多個屬性,包裹屬性名的引號是可選的。
警告： 當設置樣式名（“class”）屬性時，必須使用引號！
注意: jQuery禁止改變一個 <input> 或 <button>元素的type 特性（attribute），并且在所有瀏覽器下將拋出一個錯誤。因為Internet Explorer不會允許你改變<input>或者<button>元素的type屬性。
Computed attribute values(推算屬性值)
通過使用一個函數來設置屬性， 可以根據該元素上的其它屬性值返回最終所需的屬性值。例如，我們可以把新的值與現有的值聯系在一起：
$('#greatphoto').attr('title', function(i, val) {
return val + ' - photo by Kelly Clark'
});
當前運用一個函數來計算屬性的值，當我們修改了多個元素的屬性，特別有用。
注意 如果setter函數沒有返回任何數據（例如：function(index, attr){})，屬性的當前值返回值是undefined，作為一個getter行為。實際上，如果不進行任何更改的setter函數不返回的東西。
例子:
Example: 為頁面中全部的 <img>設置一些屬性。
<!DOCTYPE html>
<html>
<head>
<style>
img { padding:10px; }
div { color:red; font-size:24px; }
</style>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<img />
<img />
<img />
<div><B>Attribute of Ajax</B></div>
<script>
$("img").attr({
src: "images/hat.gif",
title: "jQuery",
alt: "jQuery Logo"
});
$("div").text($("img").attr("alt"));
</script>
</body>
</html>
關于“attr怎么使用”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識，可以關注億速云行業資訊頻道，小編每天都會為大家更新不同的知識點。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
