亚洲综合国产激情,久久网址精品

1.1. jQuery 介紹

1.1.1 JavaScript 庫

? JavaScript庫：即 library，是一個封裝好的特定的集合（方法和函數(shù)）。從封裝一大堆函數(shù)的角度理解庫，就是在這個庫中，封裝了很多預(yù)先定義好的函數(shù)在里面，比如動畫animate、hide、show，比如獲取元素等。

簡單理解：就是一個JS 文件，里面對我們原生js代碼進行了封裝，存放到里面。這樣我們可以快速高效的使用這些封裝好的功能了。

比如 jQuery，就是為了快速方便的操作DOM，里面基本都是函數(shù)（方法）。

? 常見的JavaScript 庫：jQuery、Prototype、YUI、Dojo、Ext JS、移動端的zepto等，這些庫都是對原生 JavaScript 的封裝，內(nèi)部都是用 JavaScript 實現(xiàn)的，我們主要學(xué)習(xí)的是 jQuery。

1.1.2 jQuery的概念

? jQuery總體概況如下 :

jQuery 是一個快速、簡潔的 JavaScript 庫，其設(shè)計的宗旨是“write Less，Do More”，即倡導(dǎo)寫更少的代碼，做更多的事情。
j 就是 JavaScript； Query 查詢；意思就是查詢js，把js中的DOM操作做了封裝，我們可以快速的查詢使用里面的功能。
jQuery 封裝了 JavaScript 常用的功能代碼，優(yōu)化了 DOM 操作、事件處理、動畫設(shè)計和 Ajax 交互。
學(xué)習(xí)jQuery本質(zhì)：就是學(xué)習(xí)調(diào)用這些函數(shù)（方法）。
jQuery 出現(xiàn)的目的是加快前端人員的開發(fā)速度，我們可以非常方便的調(diào)用和使用它，從而提高開發(fā)效率。

1.1.3 jQuery的優(yōu)點

輕量級。核心文件才幾十kb，不會影響頁面加載速度。
跨瀏覽器兼容，基本兼容了現(xiàn)在主流的瀏覽器。
鏈?zhǔn)骄幊?、隱式迭代。
對事件、樣式、動畫支持，大大簡化了DOM操作。
支持插件擴展開發(fā)。有著豐富的第三方的插件，例如：樹形菜單、日期控件、輪播圖等。
免費、開源。

1.2. jQuery 的基本使用

1.2.1 jQuery 的下載

? jQuery的官網(wǎng)地址： https://jquery.com/，官網(wǎng)即可下載最新版本。

各個版本的下載：https://code.jquery.com/

? 版本介紹：

1x ：兼容 IE 678 等低版本瀏覽器，官網(wǎng)不再更新

2x ：不兼容 IE 678 等低版本瀏覽器，官網(wǎng)不再更新

3x ：不兼容 IE 678 等低版本瀏覽器，是官方主要更新維護的版本

1.2.2. 體驗jQuery

? 步驟：

引入jQuery文件。
在文檔最末尾插入 script 標(biāo)簽，書寫體驗代碼。
$('div').hide() 可以隱藏盒子。

1.2.3. jQuery的入口函數(shù)

? jQuery中常見的兩種入口函數(shù)：

// 第一種: 簡單易用。
$(function () {   
    ...  // 此處是頁面 DOM 加載完成的入口
}) ; 

// 第二種: 繁瑣，但是也可以實現(xiàn)
$(document).ready(function(){
   ...  //  此處是頁面DOM加載完成的入口
});

? 總結(jié)：

等著 DOM 結(jié)構(gòu)渲染完畢即可執(zhí)行內(nèi)部代碼，不必等到所有外部資源加載完成，jQuery 幫我們完成了封裝。
相當(dāng)于原生 js 中的 DOMContentLoaded。
不同于原生 js 中的 load 事件是等頁面文檔、外部的 js 文件、css文件、圖片加載完畢才執(zhí)行內(nèi)部代碼。
更推薦使用第一種方式。

1.2.4. jQuery中的頂級對象$

$是 jQuery 的別稱，在代碼中可以使用 jQuery 代替，但一般為了方便，通常都直接使用 $ 。
$是jQuery的頂級對象，相當(dāng)于原生JavaScript中的 window。把元素利用$包裝成jQuery對象，就可以調(diào)用jQuery 的方法。

1.2.5. jQuery 對象和 DOM 對象

? 使用 jQuery 方法和原生JS獲取的元素是不一樣的，總結(jié)如下 :

用原生 JS 獲取來的對象就是 DOM 對象
jQuery 方法獲取的元素就是 jQuery 對象。
jQuery 對象本質(zhì)是：利用$對DOM 對象包裝后產(chǎn)生的對象（偽數(shù)組形式存儲）。

注意：

只有 jQuery 對象才能使用 jQuery 方法，DOM 對象則使用原生的 JavaScirpt 方法。

1.2.6. jQuery 對象和 DOM 對象轉(zhuǎn)換

? DOM 對象與 jQuery 對象之間是可以相互轉(zhuǎn)換的。因為原生js 比 jQuery 更大，原生的一些屬性和方法 jQuery沒有給我們封裝. 要想使用這些屬性和方法需要把jQuery對象轉(zhuǎn)換為DOM對象才能使用。

// 1.DOM對象轉(zhuǎn)換成jQuery對象，方法只有一種
var box = document.getElementById('box');  // 獲取DOM對象
var jQueryObject = $(box);  // 把DOM對象轉(zhuǎn)換為 jQuery 對象

// 2.jQuery 對象轉(zhuǎn)換為 DOM 對象有兩種方法：
//   2.1 jQuery對象[索引值]
var domObject1 = $('div')[0]

//   2.2 jQuery對象.get(索引值)
var domObject2 = $('div').get(0)

總結(jié)：實際開發(fā)比較常用的是把DOM對象轉(zhuǎn)換為jQuery對象，這樣能夠調(diào)用功能更加強大的jQuery中的方法。

1.3. jQuery 選擇器

? 原生 JS 獲取元素方式很多，很雜，而且兼容性情況不一致，因此 jQuery 給我們做了封裝，使獲取元素統(tǒng)一標(biāo)準(zhǔn)。

1.3.1. 基礎(chǔ)選擇器

$("選擇器")   //  里面選擇器直接寫 CSS 選擇器即可，但是要加引號

1.3.2. 層級選擇器

? 層級選擇器最常用的兩個分別為：后代選擇器和子代選擇器。

基礎(chǔ)選擇器和層級選擇器案例代碼

<body>
    <div>我是div</div>
    <div class="nav">我是nav div</div>
    <p>我是p</p>
    <ul>
        <li>我是ul 的</li>
        <li>我是ul 的</li>        
        <li>我是ul 的</li>
    </ul>
    <script>
        $(function() {
            console.log($(".nav"));
            console.log($("ul li"));
        })
    </script>
</body>

隱式迭代

// 1. 獲取四個div元素 
        console.log($("div"));
// 2. 給四個div設(shè)置背景顏色為粉色 jquery對象不能使用style
$("div").css("background", "pink");
// 3. 隱式迭代就是把匹配的所有元素內(nèi)部進行遍歷循環(huán)，給每一個元素添加css這個方法
$("ul li").css("color", "red");

1.3.3. 篩選選擇器

? 篩選選擇器，顧名思義就是在所有的選項中選擇滿足條件的進行篩選選擇。常見如下 :

案例代碼

<body>
    <ul>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
    </ul>
    <ol>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
        <li>多個里面篩選幾個</li>
    </ol>
    <script>
        $(function() {
            $("ul li:first").css("color", "red");
            $("ul li:eq(2)").css("color", "blue");
            $("ol li:odd").css("color", "skyblue");
            $("ol li:even").css("color", "pink");
        })
    </script>
</body>

下拉列表

 $(function() {
            // 鼠標(biāo)經(jīng)過
            $(".nav>li").mouseover(function() {
                // $(this) jQuery 當(dāng)前元素  this不要加引號
                // show() 顯示元素  hide() 隱藏元素
                $(this).children("ul").show();
            });
            // 鼠標(biāo)離開
            $(".nav>li").mouseout(function() {
                $(this).children("ul").hide();
            })
        })

另: jQuery中還有一些篩選方法，類似DOM中的通過一個節(jié)點找另外一個節(jié)點，父、子、兄以外有所加強。

<body>
    <ol>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li class="item">我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
    </ol>
    <ul>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
        <li>我是ol 的li</li>
    </ul>
    <div class="current">俺有current</div>
    <div>俺木有current</div>
    <script>
        // 注意一下都是方法 帶括號
        $(function() {
            // 1. 兄弟元素siblings 除了自身元素之外的所有親兄弟
            $("ol .item").siblings("li").css("color", "red");
            // 2. 第n個元素
            var index = 2;
            // (1) 我們可以利用選擇器的方式選擇
            // $("ul li:eq(2)").css("color", "blue");
            // $("ul li:eq("+index+")").css("color", "blue");
            // (2) 我們可以利用選擇方法的方式選擇 更推薦這種寫法
            // $("ul li").eq(2).css("color", "blue");
            // $("ul li").eq(index).css("color", "blue");
            // 3. 判斷是否有某個類名
            console.log($("div:first").hasClass("current"));
            console.log($("div:last").hasClass("current"));
        });
    </script>
</body>

1.3.4 知識鋪墊

jQuery 設(shè)置樣式

$('div').css('屬性', '值')

jQuery 里面的排他思想

// 想要多選一的效果，排他思想：當(dāng)前元素設(shè)置樣式，其余的兄弟元素清除樣式。
$(this).css(“color”,”red”);
$(this).siblings(). css(“color”,””);

隱式迭代

// 遍歷內(nèi)部 DOM 元素（偽數(shù)組形式存儲）的過程就叫做隱式迭代。
// 簡單理解：給匹配到的所有元素進行循環(huán)遍歷，執(zhí)行相應(yīng)的方法，而不用我們再進行循環(huán)，簡化我們的操作，方便我們調(diào)用。
$('div').hide();  // 頁面中所有的div全部隱藏，不用循環(huán)操作

鏈?zhǔn)骄幊?/li>

// 鏈?zhǔn)骄幊淌菫榱斯?jié)省代碼量，看起來更優(yōu)雅。
$(this).css('color', 'red').sibling().css('color', '');

1.3.5 案例：淘寶服飾精品案例

思路分析:
1.核心原理：鼠標(biāo)經(jīng)過左側(cè)盒子某個小li，就讓內(nèi)容區(qū)盒子相對應(yīng)圖片顯示，其余的圖片隱藏。
2.需要得到當(dāng)前小li 的索引號，就可以顯示對應(yīng)索引號的圖片
3.jQuery 得到當(dāng)前元素索引號 $(this).index()
4.中間對應(yīng)的圖片，可以通過 eq(index) 方法去選擇
5.顯示元素 show() 隱藏元素 hide()

 $(function() {
            // 1. 鼠標(biāo)經(jīng)過左側(cè)的小li 
            $("#left li").mouseover(function() {
                // 2. 得到當(dāng)前小li 的索引號
                var index = $(this).index();
                console.log(index);
                // 3. 讓我們右側(cè)的盒子相應(yīng)索引號的圖片顯示出來就好了
                // $("#content div").eq(index).show();
                // 4. 讓其余的圖片（就是其他的兄弟）隱藏起來
                // $("#content div").eq(index).siblings().hide();
                // 鏈?zhǔn)骄幊?                $("#content div").eq(index).show().siblings().hide();

            })
        })

1.4. jQuery 樣式操作

? jQuery中常用的樣式操作有兩種：css() 和設(shè)置類樣式方法

1.4.1. 方法1: 操作 css 方法

? jQuery 可以使用 css 方法來修改簡單元素樣式；也可以操作類，修改多個樣式。

? 常用以下三種形式 :

// 1.參數(shù)只寫屬性名，則是返回屬性值
var strColor = $(this).css('color');

// 2.  參數(shù)是屬性名，屬性值，逗號分隔，是設(shè)置一組樣式，屬性必須加引號，值如果是數(shù)字可以不用跟單位和引號
$(this).css(''color'', ''red'');

// 3.  參數(shù)可以是對象形式，方便設(shè)置多組樣式。屬性名和屬性值用冒號隔開， 屬性可以不用加引號
$(this).css({ "color":"white","font-size":"20px"});

? 注意：css() 多用于樣式少時操作，多了則不太方便。

1.4.2. 方法2: 設(shè)置類樣式方法

? 作用等同于以前的 classList，可以操作類樣式，注意操作類里面的參數(shù)不要加點。

? 常用的三種設(shè)置類樣式方法：

// 1.添加類
$("div").addClass("current");

// 2.刪除類
$("div").removeClass("current");

// 3.切換類
$("div").toggleClass("current");

追加類名

<script>
        // var one = document.querySelector(".one");
        // one.className = "two";
        // $(".one").addClass("two");  這個addClass相當(dāng)于追加類名 不影響以前的類名
        $(".one").removeClass("two");
    </script>

? 注意：

設(shè)置類樣式方法比較適合樣式多時操作，可以彌補css()的不足。
原生 JS 中 className 會覆蓋元素原先里面的類名，jQuery 里面類操作只是對指定類進行操作，不影響原先的類名。

1.4.3. 案例：tab 欄切換

思路分析:
1.點擊上部的li，當(dāng)前l(fā)i 添加current類，其余兄弟移除類。
2.點擊的同時，得到當(dāng)前l(fā)i 的索引號
3.讓下部里面相應(yīng)索引號的item顯示，其余的item隱藏

  $(function() {
            // 1.點擊上部的li，當(dāng)前l(fā)i 添加current類，其余兄弟移除類
            $(".tab_list li").click(function() {
                // 鏈?zhǔn)骄幊滩僮?                $(this).addClass("current").siblings().removeClass("current");
                // 2.點擊的同時，得到當(dāng)前l(fā)i 的索引號
                var index = $(this).index();
                console.log(index);
                // 3.讓下部里面相應(yīng)索引號的item顯示，其余的item隱藏
                $(".tab_con .item").eq(index).show().siblings().hide();
            });
        })

1.5. jQuery 效果

? jQuery 給我們封裝了很多動畫效果，最為常見的如下：

顯示隱藏：show() / hide() / toggle() ;
劃入畫出：slideDown() / slideUp() / slideToggle() ;
淡入淡出：fadeIn() / fadeOut() / fadeToggle() / fadeTo() ;
自定義動畫：animate() ;

注意：

動畫或者效果一旦觸發(fā)就會執(zhí)行，如果多次觸發(fā)，就造成多個動畫或者效果排隊執(zhí)行。

jQuery為我們提供另一個方法，可以停止動畫排隊：stop() ;

1.5.1. 顯示隱藏

? 顯示隱藏動畫，常見有三個方法：show() / hide() / toggle() ;

? 語法規(guī)范如下:

代碼演示

<body>
    <button>顯示</button>
    <button>隱藏</button>
    <button>切換</button>
    <div></div>
    <script>
        $(function() {
            $("button").eq(0).click(function() {
                $("div").show(1000, function() {
                    alert(1);
                });
            })
            $("button").eq(1).click(function() {
                $("div").hide(1000, function() {
                    alert(1);
                });
            })
            $("button").eq(2).click(function() {
              $("div").toggle(1000);
            })
            // 一般情況下，我們都不加參數(shù)直接顯示隱藏就可以了
        });
    </script>
</body>

1.5.2. 滑入滑出

? 滑入滑出動畫，常見有三個方法：slideDown() / slideUp() / slideToggle() ;

? 語法規(guī)范如下:

代碼演示

<body>
    <button>下拉滑動</button>
    <button>上拉滑動</button>
    <button>切換滑動</button>
    <div></div>
    <script>
        $(function() {
            $("button").eq(0).click(function() {
                // 下滑動 slideDown()
                $("div").slideDown();
            })
            $("button").eq(1).click(function() {
                // 上滑動 slideUp()
                $("div").slideUp(500);
            })
            $("button").eq(2).click(function() {
                // 滑動切換 slideToggle()
                $("div").slideToggle(500);
            });
        });
    </script>
</body>

小案例：下拉菜單略（詳情參看源碼）。

1.5.3 淡入淡出

? 淡入淡出動畫，常見有四個方法：fadeIn() / fadeOut() / fadeToggle() / fadeTo() ;

? 語法規(guī)范如下:

突出顯示

 $(function() {
            //鼠標(biāo)進入的時候,其他的li標(biāo)簽透明度：0.5
            $(".wrap li").hover(function() {
                $(this).siblings().stop().fadeTo(400, 0.5);
            }, function() {
                // 鼠標(biāo)離開，其他li 透明度改為 1
                $(this).siblings().stop().fadeTo(400, 1);
            })

        });

代碼演示

<body>
    <button>淡入效果</button>
    <button>淡出效果</button>
    <button>淡入淡出切換</button>
    <button>修改透明度</button>
    <div></div>
    <script>
        $(function() {
            $("button").eq(0).click(function() {
                // 淡入 fadeIn()
                $("div").fadeIn(1000);
            })
            $("button").eq(1).click(function() {
                // 淡出 fadeOut()
                $("div").fadeOut(1000);
            })
            $("button").eq(2).click(function() {
                // 淡入淡出切換 fadeToggle()
                $("div").fadeToggle(1000);
            });
            $("button").eq(3).click(function() {
                //  修改透明度 fadeTo() 這個速度和透明度要必須寫
                $("div").fadeTo(1000, 0.5);
            });
        });
    </script>
</body>

1.5.4 自定義動畫

? 自定義動畫非常強大，通過參數(shù)的傳遞可以模擬以上所有動畫，方法為：animate() ;

? 語法規(guī)范如下:

代碼演示

<body>
    <button>動起來</button>
    <div></div>
    <script>
        $(function() {
            $("button").click(function() {
                $("div").animate({
                    left: 500,
                    top: 300,
                    opacity: .4,
                    width: 500
                }, 500);
            })
        })
    </script>
</body>

1.5.5 停止動畫排隊

? 動畫或者效果一旦觸發(fā)就會執(zhí)行，如果多次觸發(fā)，就造成多個動畫或者效果排隊執(zhí)行。

? 停止動畫排隊的方法為：stop() ;

stop() 方法用于停止動畫或效果。
stop() 寫到動畫或者效果的前面，相當(dāng)于停止結(jié)束上一次的動畫。

? 總結(jié): 每次使用動畫之前，先調(diào)用 stop() ,在調(diào)用動畫。

1.5.6. 事件切換

? jQuery中為我們添加了一個新事件 hover() ; 功能類似 css 中的偽類 :hover 。介紹如下

語法

hover([over,]out)     // 其中over和out為兩個函數(shù)

over:鼠標(biāo)移到元素上要觸發(fā)的函數(shù)（相當(dāng)于mouseenter）
out:鼠標(biāo)移出元素要觸發(fā)的函數(shù)（相當(dāng)于mouseleave）
如果只寫一個函數(shù)，則鼠標(biāo)經(jīng)過和離開都會觸發(fā)它

hover事件和停止動畫排列案例

<body>
    <ul class="nav">
        <li>
            <a href="#">微博</a>
            <ul><li><a href="">私信</a></li><li><a href="">評論</a></li><li><a href="">@我</a></li></ul>
        </li>
        <li>
            <a href="#">微博</a>
            <ul><li><a href="">私信</a></li><li><a href="">評論</a></li><li><a href="">@我</a></li></ul>
        </li>
    </ul>
    <script>
        $(function() {
            // 鼠標(biāo)經(jīng)過
            // $(".nav>li").mouseover(function() {
            //     // $(this) jQuery 當(dāng)前元素  this不要加引號
            //     // show() 顯示元素  hide() 隱藏元素
            //     $(this).children("ul").slideDown(200);
            // });
            // // 鼠標(biāo)離開
            // $(".nav>li").mouseout(function() {
            //     $(this).children("ul").slideUp(200);
            // });
            // 1. 事件切換 hover 就是鼠標(biāo)經(jīng)過和離開的復(fù)合寫法
            // $(".nav>li").hover(function() {
            //     $(this).children("ul").slideDown(200);
            // }, function() {
            //     $(this).children("ul").slideUp(200);
            // });
            // 2. 事件切換 hover  如果只寫一個函數(shù)，那么鼠標(biāo)經(jīng)過和鼠標(biāo)離開都會觸發(fā)這個函數(shù)
            $(".nav>li").hover(function() {
                // stop 方法必須寫到動畫的前面
                $(this).children("ul").stop().slideToggle();
            });
        })
    </script>
</body>

1.5.7. 案例：王者榮耀手風(fēng)琴效果

思路分析:
1.鼠標(biāo)經(jīng)過某個小li 有兩步操作：
2.當(dāng)前小li 寬度變?yōu)?224px，同時里面的小圖片淡出，大圖片淡入
3.其余兄弟小li寬度變?yōu)?9px，小圖片淡入，大圖片淡出

 $(function() {
            // 鼠標(biāo)經(jīng)過某個小li 有兩步操作：
            $(".king li").mouseenter(function() {
                // 1.當(dāng)前小li 寬度變?yōu)?224px， 同時里面的小圖片淡出，大圖片淡入
                $(this).stop().animate({
                    width: 224
                }).find(".small").stop().fadeOut().siblings(".big").stop().fadeIn();
                // 2.其余兄弟小li寬度變?yōu)?9px， 小圖片淡入， 大圖片淡出
                $(this).siblings("li").stop().animate({
                    width: 69
                }).find(".small").stop().fadeIn().siblings(".big").stop().fadeOut();
            })
        });

?## 1.6. 今日總結(jié)

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av

1. jQuery的入口函數(shù)、jQuery 對象和 DOM 對象、jQuery 選擇器、 jQuery 樣式操作、jQuery 效果

1. jQuery的入口函數(shù)、jQuery 對象和 DOM 對象、jQuery 選擇器、 jQuery 樣式操作、jQuery 效果

1.1. jQuery 介紹

1.1.1 JavaScript 庫

1.1.2 jQuery的概念

1.1.3 jQuery的優(yōu)點

1.2. jQuery 的基本使用

1.2.1 jQuery 的下載

1.2.2. 體驗jQuery

1.2.3. jQuery的入口函數(shù)

1.2.4. jQuery中的頂級對象$

1.2.5. jQuery 對象和 DOM 對象

1.2.6. jQuery 對象和 DOM 對象轉(zhuǎn)換

1.3. jQuery 選擇器

1.3.1. 基礎(chǔ)選擇器

1.3.2. 層級選擇器

1.3.3. 篩選選擇器

1.3.4 知識鋪墊

1.3.5 案例：淘寶服飾精品案例

1.4. jQuery 樣式操作

1.4.1. 方法1: 操作 css 方法

1.4.2. 方法2: 設(shè)置類樣式方法

1.4.3. 案例：tab 欄切換

1.5. jQuery 效果

1.5.1. 顯示隱藏

1.5.2. 滑入滑出

1.5.3 淡入淡出

1.5.4 自定義動畫

1.5.5 停止動畫排隊

1.5.6. 事件切換

1.5.7. 案例：王者榮耀手風(fēng)琴效果

友情鏈接更多精彩內(nèi)容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九 欧美,1769亚洲,黄色成人av

1. jQuery的入口函數(shù)、jQuery 對象和 DOM 對象、jQuery 選擇器、 jQuery 樣式操作、jQuery 效果

1.1. jQuery 介紹

1.1.1 JavaScript 庫

1.1.2 jQuery的概念

1.1.3 jQuery的優(yōu)點

1.2. jQuery 的基本使用

1.2.1 jQuery 的下載

1.2.2. 體驗jQuery

1.2.3. jQuery的入口函數(shù)

1.2.4. jQuery中的頂級對象$

1.2.5. jQuery 對象和 DOM 對象

1.2.6. jQuery 對象和 DOM 對象轉(zhuǎn)換

1.3. jQuery 選擇器

1.3.1. 基礎(chǔ)選擇器

1.3.2. 層級選擇器

1.3.3. 篩選選擇器

1.3.4 知識鋪墊

1.3.5 案例：淘寶服飾精品案例

1.4. jQuery 樣式操作

1.4.1. 方法1: 操作 css 方法

1.4.2. 方法2: 設(shè)置類樣式方法

1.4.3. 案例：tab 欄切換

1.5. jQuery 效果

1.5.1. 顯示隱藏

1.5.2. 滑入滑出

1.5.3 淡入淡出

1.5.4 自定義動畫

1.5.5 停止動畫排隊

1.5.6. 事件切換

1.5.7. 案例：王者榮耀手風(fēng)琴效果

友情鏈接更多精彩內(nèi)容

色偷偷精品伊人,欧洲久久精品,欧美综合婷婷骚逼,国产AV主播,国产最新探花在线,九色在线视频一区,伊人大交九欧美,1769亚洲,黄色成人av

1. jQuery的入口函數(shù)、jQuery 對象和 DOM 對象、jQuery 選擇器、 jQuery 樣式操作、jQuery 效果