语法结构:$(selector).attr(attribute), //selector为选择器名,attribute为指定要获取的元素的属性名

修改元素属性的$(selector).attr(attribute,value), //selector为选择器名,attribute为指定要获取的元素的属性名

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>获取元素属性</title>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
a{text-decoration:none;}
li{list-style-type:none; }
</style>

<script type="text/javascript">
$(document).ready(function(e) {
$("#getattr").click(function(e){

      //click为点击事件
       var str = "<br \>" + $("#aa").attr("title");//结果为:一
       str += "<br \>" + $("#bb").attr("href");//结果为:https://hao.360.cn/
       str += "<br \>" + $("#cc").attr("id");//结果为:cc
       str += "<br \>" + $("#getattr").attr("value");//结果为:显示属性信息


        $("#attr_getinfo").append(str);//在div中显示属性的值
       //append():在被选元素的结尾(仍然在内部)插入指定内容
})

});
</script>
</head>

<body>
<ul id="nav">
<li><a href="3-1.html" id="aa" title="一">介绍1</a></li>
<li><a href="https://hao.360.cn/" id="bb" title="二">介绍2</a></li>
<li><a href="#" id="cc" title="三">介绍3</a></li>
</ul>
<div id="centent"></div>
<div id="attr_getinfo">
<input id="getattr" type="button" value="显示属性信息" />

</div>

</body>
</html>

posted on 2016-07-23 11:31  Moon紫月  阅读(15314)  评论(1编辑  收藏  举报