jQuery et sélec...LOGIN

jQuery et sélecteurs (filtrage)

et sélecteur (de filtre)


 :premier

Utilisation:$("tr:first");Une collection d'éléments uniques

Correspond au premier élément trouvé


:last

correspond au dernier élément trouvé


:no(selector)

Supprimer les éléments correspondant aux éléments donnés sélecteur


:pair

correspond à tous les éléments avec des valeurs d'index paires, à partir de 0


:odd

Correspond à tous les éléments avec des valeurs d'index impaires, en comptant à partir de 0


:eq(index)

Correspond à un élément avec une valeur d'index donnée, à partir de 0

:gt(index)

Correspond à tous les éléments supérieurs à la valeur d'index donnée, en comptant à partir de 0


:lt(index )

Correspond à tous les éléments inférieurs à la valeur d'index donnée, en comptant à partir de 0


:en-tête

correspond à h1, les éléments de titre tels que h2, h3

<!DOCTYPE html>
<html>
    <head>
        <title>php.cn</title>
        <meta charset="utf-8" />
        <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
        <script >
        function f1(){
            //$("li").css('background-color','blue');
            //① :first  找到第一个
            //li元素同时,还需要是第一个
            $("li:first").css('background-color','blue');

            //② :last  找到最后一个
            $("li:last").css('background-color','green');

            //③ :eq(下标)  下标从0计算, equal()
            $("li:eq(4)").css('background-color','pink');

            //④ :gt(索引值)  下标大于条件索引值, great than
            $("li:gt(4)").css('color','red');

            //⑤ :lt(索引值)  下标小于条件索引值, less than
            $("li:lt(3)").css('color','orange');

            //⑥ :even  下标索引值等于偶数的
            $("li:even").css('background-color','gray');
            //⑦ :odd  下标索引值等于奇数的
            $("li:odd").css('color','red');

            //⑧ :not(选择器)  去除与“选择器”匹配的元素
            $("li:not(#zhao,#zhang)").css('color','red');

            //⑨ :header  获得h1/h2/h3...的标题元素
            $(":header").css('color','blue');
        }
        </script>
    </head>
    <body>
        <h1>php.cn</h1>
        <h2>php.cn</h2>
        <h3>php.cn</h3>
        <h4>php.cn</h4>
        <ul>
            <li>北京</li>
            <li id="zhang">上海</li>
            <li>广州</li>
            <li id="zhao">深圳</li>

            <li>杭州</li>
            <li>武汉</li>
            <li>南京</li>
            <li>天津</li>
        </ul>

        <input type="button" value="触发" onclick="f1()" />
    </body>
</html>
section suivante
<!DOCTYPE html> <html> <head> <title>php.cn</title> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script > function f1(){ //$("li").css('background-color','blue'); //① :first 找到第一个 //li元素同时,还需要是第一个 $("li:first").css('background-color','blue'); //② :last 找到最后一个 $("li:last").css('background-color','green'); //③ :eq(下标) 下标从0计算, equal() $("li:eq(4)").css('background-color','pink'); //④ :gt(索引值) 下标大于条件索引值, great than $("li:gt(4)").css('color','red'); //⑤ :lt(索引值) 下标小于条件索引值, less than $("li:lt(3)").css('color','orange'); //⑥ :even 下标索引值等于偶数的 $("li:even").css('background-color','gray'); //⑦ :odd 下标索引值等于奇数的 $("li:odd").css('color','red'); //⑧ :not(选择器) 去除与“选择器”匹配的元素 $("li:not(#zhao,#zhang)").css('color','red'); //⑨ :header 获得h1/h2/h3...的标题元素 $(":header").css('color','blue'); } </script> </head> <body> <h1>php.cn</h1> <h2>php.cn</h2> <h3>php.cn</h3> <h4>php.cn</h4> <ul> <li>北京</li> <li id="zhang">上海</li> <li>广州</li> <li id="zhao">深圳</li> <li>杭州</li> <li>武汉</li> <li>南京</li> <li>天津</li> </ul> <input type="button" value="触发" onclick="f1()" /> </body> </html>
soumettreRéinitialiser le code
chapitredidacticiel