Atribut dan gaya jQuery (6)

Dapatkan atribut gaya pada elemen dom melalui JavaScript dan kami boleh menetapkan atribut gaya secara dinamik kepada elemen tersebut. Dalam jQuery, jika kita ingin mengubah suai atribut gaya secara dinamik, kita hanya perlu menggunakan kaedah css() untuk mencapai kaedah

css() ini: Dapatkan nilai terkira atribut gaya elemen atau tetapkan CSS atribut elemen

Dapatkan:

css( propertyName ): Dapatkan nilai terkira atribut gaya elemen pertama dalam koleksi elemen yang sepadan

css( propertyNames ) : Lulus tatasusunan dan kembalikan hasil objek

Tetapan:

css(propertyName, value): Tetapkan CSS

css(propertyName, function): Anda boleh lulus dalam fungsi panggil balik dan kembalikan nilai yang sepadan Memproses

css ( sifat ): Anda boleh menghantar objek dan menetapkan berbilang gaya pada masa yang sama

Nota:

Sifat penyemak imbas ialah diperoleh dengan cara yang berbeza Apabila mendapatkan nilai tertentu Semua jQuery menggunakan pemprosesan bersatu, seperti menggunakan RBG untuk warna dan px untuk saiz Kaedah css() menyokong penulisan kes bercampur-campur dilakukan hanya sebagai nilai, jQuery akan menukarnya kepada rentetan dan menambah px pada penghujung rentetan, seperti .css("width",50}) dan .css("width", "50px"})

Mari kita lihat sekeping kod:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <div>php 中文网</div>

    <script>
        $('div').css('color','red');
    </script>
</body>
</html>

Tukar gaya kandungan dalam div

Mari kita lihat apa yang berlaku jika berbilang gaya diubah, contohnya , jika saya ingin menetapkan lebar, ketinggian atau latar belakang untuk teg div, bagaimanakah saya harus menulisnya?

Kemudian mari kita mula menulis sekeping kod seperti ini:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <div>php 中文网</div>
    
    <script>
        $("div").css({
            width:'200px',
            height:'200px',
            background:'#ccc'
        });
    </script>
</body>
</html>

Melihat kod di atas, kita boleh menetapkan latar belakang lebar dan ketinggian ススv  kepada gaya yang kita mahu

Nota: Apabila kita menulis, kita perlu menamatkan atribut dengan koma Apabila kita menulis yang terakhir, kita boleh melakukannya tanpa koma

Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div>php 中文网</div> <script> $("div").css({ width:'200px', height:'200px', background:'#ccc' }); </script> </body> </html>
  • Cadangan kursus
  • Muat turun perisian kursus
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!