pemilih asas jQ...LOGIN

pemilih asas jQuery

Apakah itu pemilih

Syarat yang digunakan untuk mendapatkan pelbagai objek nod elemen pada halaman ialah pemilih.

document.getElementById()

document.getElementsByTagName();

document.getElementsByName();

Asas pilih 🎜>

  • $('#id attribute value') ----------->document.getElementById()

  • $('nama tag teg')---------->document.getElementsByTagName();

  • $('. kelas nilai atribut') pemilih nilai atribut kelas

  • $('*') Pemilih kad bebas

  • $('s1,s2, s3') Pemilih kesatuan

  • <!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(){
                //① $('#id属性值')
                $('#username').css('color','red');
    
                //② $('tag标签名称')tag标签选择器
                $('input').css('background-color','blue');
    
                //③ $('.class属性值') class类别选择器
                $('.apple').css('background-color','green');
    
                //④ $('*') 通配符选择器
                //$('*').css('background-color','gray');
    
                //⑤ $('s1,s2,s3...')联合选择器selector
                $('p,#username,.apple').css('font-size','25px');
            }
            </script>
    
            <style type="text/css">
            #username{}
            p{}
            .apple{}
            *{}
            .apple,span,input{} /*联合选择器*/
            </style>
        </head>
        <body>
            <h2>基本选择器(灵感来源于css样式选择器)</h2>
            <input type="text" name="username" value="php中文网" id="username" /><br />
            <p>大家好</p>
            <div class="apple">欢迎来到php中文网</div>
            <span>让我们一起开始学习jQuery吧</span><br />
    
            <input type="button" value="触发" onclick="f1()" />
        </body>
    </html>
    bahagian seterusnya
<!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(){ //① $('#id属性值') $('#username').css('color','red'); //② $('tag标签名称')tag标签选择器 $('input').css('background-color','blue'); //③ $('.class属性值') class类别选择器 $('.apple').css('background-color','green'); //④ $('*') 通配符选择器 //$('*').css('background-color','gray'); //⑤ $('s1,s2,s3...')联合选择器selector $('p,#username,.apple').css('font-size','25px'); } </script> <style type="text/css"> #username{} p{} .apple{} *{} .apple,span,input{} /*联合选择器*/ </style> </head> <body> <h2>基本选择器(灵感来源于css样式选择器)</h2> <input type="text" name="username" value="php中文网" id="username" /><br /> <p>大家好</p> <div class="apple">欢迎来到php中文网</div> <span>让我们一起开始学习jQuery吧</span><br /> <input type="button" value="触发" onclick="f1()" /> </body> </html>
babperisian kursus