Comment les objets jQuery encapsulent les objets dom

L'objet dom est le composant tableau de l'objet jquery

<!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(){
            //jquery对象 转化为 dom对象 进而调用dom的成员
            $('#apple')[0].style.backgroundColor = "blue";
            $('li')[1].style.backgroundColor = "brown";
        }
        </script>
        <style type="text/css">
        div {width:300px;height:200px; background-color:pink;}
        </style>
    </head>
    <body>
        <div id="apple"></div>
        <ul>
            <li>北京</li>
            <li>上海</li>
            <li>深圳</li>
        </ul>
        <input type="button" value="触发1" onclick="f1()" />
    </body>
</html>

section suivante

nouveau fichier

<!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(){
 //jquery对象 转化为 dom对象 进而调用dom的成员
 $('#apple')[0].style.backgroundColor = "blue";
 $('li')[1].style.backgroundColor = "brown";
 }
 </script>
 <style type="text/css">
 div {width:300px;height:200px; background-color:pink;}
 </style>
 </head>
 <body>
 <div id="apple"></div>
 <ul>
 <li>北京</li>
 <li>上海</li>
 <li>深圳</li>
 </ul>
 <input type="button" value="触发1" onclick="f1()" />
 </body>
</html>

soumettre Réinitialiser le code

Opération automatique

Plein écran