<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="button" value="獲取屬性" id="btn1">
<input type="button" value="設置屬性" id="btn2">
<input type="button" value="移除屬性" id="btn3">
<img src="../Images/1.jpg" alt="週五晚睡1" title="週五晚睡" ac='ac'>
</body>
</html>
<script src="../JQuery/jquery-1.12.4.js"></script>
<script>
$(function(){
//jQuery操作屬性: attr() removeAttr()
//1.設置屬性
$('#btn2').click(function(){
//設置單屬性
// $('img').attr('src','../Images/2.jpeg');//以前有src屬性，更改這個屬性
// $('img').attr('ac','自定義的');//修改自定義屬性
// $('img').attr('dd','添加的');//如果元素原來沒有這個屬性，那就是添加屬性
//設置多屬性
$('img').attr({
src:'../Images/2.jpeg',
ac:'修改後的自定義',
dd:'添加的'
})
})
//2.獲取屬性
$('#btn1').click(function(){
$('img').attr('src');//自帶的屬性可以獲取
$('img').attr('ac');//自定義的屬性可以獲取
$('img').attr('bbbbb');//如果沒有這個屬性獲取到的值就是undefind，attr()設置的屬性是可以獲取的
})
//3.移除屬性
//移除單屬性
$('#btn3').click(function(){
$('img').removeAttr('alt');
})
//移除多屬性
$('#btn3').click(function(){
$('img').removeAttr('alt ac');
})
})
</script>
作業：構建網站 - 知識準備 - jQuery - attr()，removeAttr()
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章