一、本课目标
- 获取与设置元素属性
- 删除元素属性
二、获取与设置元素属性
attr()用来获取与设置元素属性
image.png
三、删除元素属性
removeAttr()用来删除元素的属性
$(selector).removeAttr(name);
示例代码：
html文件：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>仿冬奥列表内容</title>
<link rel="stylesheet" href="css/games.css">
</head>
<body>
<div class="contain">
<h2>祝福冬奥</h2>
<input type="text" value="mmp" name="hah"/>
<ul class="gameList">
<li> 贝克汉姆：衷心希望北京能够申办成功！</li>
<li> 姚明：北京申冬奥是个非常棒的机会！加油！</li>
<li> 张虹：北京办冬奥，大家的热情定超乎想象！ </li>
<li> 肖恩怀特：我爱北京，支持北京申办冬奥会！</li>
</ul>
</div>
<script src="js/jquery-1.12.4.js"></script>
<script src="js/games.js"></script>
</body>
</html>
css文件：
*{padding:0;margin:0;}
html,body{font-family:"微软雅黑";}
.contain{width:320px;margin:5px auto; border: 1px solid #2a65ba;}
.gameList{list-style:none;}
.gameList li{padding-left:15px;line-height:40px; height:40px;font-size:12px;color:#000;border-bottom:1px #aaaaaa dashed;}
h2{font-size:16px;padding-left:20px;line-height:40px;}
js文件：
$(document).ready(function(){
// 使用attr方法获取input的name属性值
alert($("input").attr("name"));
// 使用attr方法设置input的name和value值
$("input").attr({name:1,value:2})
alert($("input").attr("name"));
alert($("input").attr("value"));
// 使用rmoveAttr方法来删除属性值
$("input").removeAttr("name");
alert($("input").attr("name"));
})
四、总结
image.png
