jquery总结（二）

层次元素关系

         1、祖先关系   空格符号

         2、父子关系   大于符号

         3、紧跟的关系  +符号

         4、紧跟后的所有兄弟关系  ~符号

        CSS样式

          1、css("");带有一个参数是获取其属性的值

          2、css("","");为其对象设置一个指定的属性和属性值

          3、css(properties);把一个“名/值对”对象设置为所有匹配元素的样式属性 {"":"","":""...};

案例：

Code:

1. <script type="text/javascript" src="./js/jquery-1.4.4.js"></script>   
2. <script type="text/javascript">   
3. $(document).ready(function(){   
4.     /**层级元素选择器的使用方式*/  
5.     /**祖先关系 符号为===>空格*/  
6.     //获取div元素的后代的所有input的元素 返回一个Jquery对象   
7.     var $inputs=$("div input");   
8.      /**输出Jquery对象的大小*/  
9.     alert($inputs.size());   
10.     /**父子关系 符号为===>>*/  
11.     var $inp=$("form>input");   
12.     var inpt=$inp[0]   
13.     inpt.style.backgroundColor="red";   
14.     alert("------中介线-------")   
15.     /**采用Jquery对象本身的css方法来设置样式*/  
16.     $inp.css("background-color","blue");   
17.     /**匹配所有紧接在某个元素后的某个元素 符号为===> +*/  
18.     var $lab=$("label+input");   
19.     /**为其添加背景颜色*/  
20.     $lab.css("background-color","green");   
21.     /**匹配 prev 元素之后的所有 siblings(兄弟) 元素  符号为====> ~*/  
22.     var $fpts=$("form~input");   
23.     $fpts.css("background-color","yellow");   
24.              /**使用到了CSS样式  
25.              .css("")//获取其样式属性的值  
26.               案例： $fipts.css("background-color");  
27.              .css("","") //为其添加样式属性及属性值  
28.               $fipts.css("background-color","yellow");  
29.              .css(Map);//把一个“名/值对”对象设置为所有匹配元素的样式属性。  
30.               $fipts.css({"background-color":"red","color":"blue"});  
31.              */  
32.     alert("获取该Jquery对象的背景颜色值："+$fpts.css("background-color"));   
33.        
34. });   
35. </script>