jQuery入門學習筆記--初學2

接着上面的,今天把自己學習的內容分析一下:

    首先得糾正一下上一篇文章的一個錯誤,在上一篇文章的最後,我提到頁面加載就要實現的效果必須要按照:

      $(document).ready(function() { 

       //實現的函數體 

       }); 

    這樣的模式才能夠進行執行,其實不然,上面我所做的實例,完全是放在完全是把<script>標籤放在html文檔格式的<head>標籤中的。如果這樣,就必須要按照上面的代碼格式才能夠實現效果,否則報錯,但是,如果我們把<script>標籤放置到html文檔的<body>標籤中呢?呵呵,這樣就可以不按照上面的方式,同樣能夠實現效果,例如:今天在學習jQuery的API時,裏面學習addClass() 方法時,jQuery代碼就是放置到<body>標籤中,在頁面加載完畢同樣實現了效果:

    以下是頁面的代碼:

    <html xmlns="http://www.w3.org/1999/xhtml">
   <head runat="server">
    <title>選擇多個css</title>
    <style type="text/css">
         p { margin: 8px; font-size:16px; }
         .selected { color:blue; }
         .highlight { background:yellow; }
  </style>

    <script src="jQuery/jquery-1.4.2.min.js"></script>  

</head>
<body>
    <form id="form1" runat="server">
        <div id="orderedlist">
            <p>
                Hello</p>
            <p>
                and</p>
            <p>
                Goodbye</p>

            <script >$("p:last").addClass("selected highlight");</script>
        </div>
    </form>
</body>
</html>

解釋一下這句“$("p:last").addClass("selected highlight");”代碼,這句代碼就是遍歷body中所有的p標籤,獲取最後一個p標籤,並給它附加已經定義好了的“selected highlight”兩個css樣式,注意,同時附加多個css樣式是以空格隔開的。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章