jquery学习之CSS（name）

CSS（name）:获取第一个匹配元素的样式属性。

参数：name---要获取的属性的名称

例题：

1 <head>
2     <title></title>
3     <script type="text/javascript" src="jquery-1.6.js"></script>
4    <style type="text/css" >
5       #p1{
6           color: Red;
7             font-size: 20px;
8       }
9         #p2{
10             color: Green;
11             font-size: 40px;
12         }
13     </style>
14 </head>
15 <body>
16 <script type="text/javascript">
17    $(function(){
18      $("#p1").hover(function(){    //hover()方法用于模拟光标悬停事件，当光标移动到元素上时，会
19       //触发指定的第一个函数，当光标移出这个元素时，会触发指定的第二个函数
20          var p1css=$("#p1").css("color");  //获取第一个段落的颜色属性
21          $("#div1").text(p1css);
22       },function(){
23          $("#div1").text("");
24       })
25
26      $("#p2").hover(function(){
27          var p1css=$("#p2").css("color");
28          $("#div1").text(p1css);
29       },function(){
30          $("#div1").text("");
31       })
32
33      $("#p3").hover(function(){
34          var p1css=$("#p3").css("color");
35          $("#div1").text(p1css);
36       },function(){
37          $("#div1").text("");
38       })
39     })
40 </script>
41 <p id="p1">这里是段落1</p>
42 <p id="p2">这里是段落2</p>
43 <font color="blue"><p id="p3">这里是段落3</p></font>
44 <div id="div1"></div>

当光标移动到段落1的时候，显示“red”；

当光标移动到段落2的时候，显示"green";

当光标移动到段落3的时候，显示“blue”；

总结，CSS（name）获取属性的值不仅可以获取使用CSS定义的属性中的值，同样可以获取HTML标记中的属性值。

当光标移动到段落1的时候，显示“red”；