jquery總結（二）

層次元素關係

         1、祖先關係   空格符號

         2、父子關係   大於符號

         3、緊跟的關係  +符號

         4、緊跟後的所有兄弟關係  ~符號

        CSS樣式

          1、css("");帶有一個參數是獲取其屬性的值

          2、css("","");爲其對象設置一個指定的屬性和屬性值

          3、css(properties);把一個“名/值對”對象設置爲所有匹配元素的樣式屬性 {"":"","":""...};

案例：

<script type="text/javascript" src="./js/jquery-1.4.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    /**層級元素選擇器的使用方式*/
    /**祖先關係 符號爲===>空格*/
    //獲取div元素的後代的所有input的元素 返回一個Jquery對象
    var $inputs=$("div input");
     /**輸出Jquery對象的大小*/
    alert($inputs.size());
    /**父子關係 符號爲===>>*/
    var $inp=$("form>input");
    var inpt=$inp[0]
    inpt.style.backgroundColor="red";
    alert("------中介線-------")
    /**採用Jquery對象本身的css方法來設置樣式*/
    $inp.css("background-color","blue");
    /**匹配所有緊接在某個元素後的某個元素 符號爲===> +*/
    var $lab=$("label+input");
    /**爲其添加背景顏色*/
    $lab.css("background-color","green");
    /**匹配 prev 元素之後的所有 siblings(兄弟) 元素  符號爲====> ~*/
    var $fpts=$("form~input");
    $fpts.css("background-color","yellow");
             /**使用到了CSS樣式
             .css("")//獲取其樣式屬性的值
              案例： $fipts.css("background-color");
             .css("","") //爲其添加樣式屬性及屬性值
              $fipts.css("background-color","yellow");
             .css(Map);//把一個“名/值對”對象設置爲所有匹配元素的樣式屬性。
              $fipts.css({"background-color":"red","color":"blue"});
             */
    alert("獲取該Jquery對象的背景顏色值："+$fpts.css("background-color"));

});
</script>