Mengapa Pengubahsuaian CSS jQuery Saya Tidak Berfungsi?

Menukar CSS Menggunakan jQuery

Semasa cuba mengubah suai CSS dengan jQuery, anda mungkin menghadapi kesukaran. Mari kita selesaikan masalah biasa.

Masalah:

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor":"black","color":"white");
    $(".bordered").css("border", "1px solid black");
}

Walaupun mengikut sintaks yang betul, kod tersebut gagal berfungsi.

Jawapan:

Ralat berpunca daripada pendakap kerinting tutup yang hilang dalam baris $("#myParagraph").css(). Kod yang betul hendaklah:

$("#myParagraph").css({"backgroundColor": "black", "color": "white"});

Pengubahsuaian ini menghasilkan fungsi JavaScript yang berfungsi yang berjaya mengubah suai elemen CSS. Untuk menjelaskan, kedua-dua notasi nama sifat CSS, "backgroundColor" dan "background-color," adalah sah dalam jQuery. Dokumentasi API jQuery mengesahkan perkara ini.

Berikut ialah demo langsung: http://jsfiddle.net/YPYz8/

Kod Kerja Lengkap:

$(init);

function init() {
    $("h1").css("backgroundColor", "yellow");
    $("#myParagraph").css({"backgroundColor": "black", "color": "white"});
    $(".bordered").css("border", "1px solid black");
}

Coretan kod ini menunjukkan cara menukar warna latar belakang elemen h1 kepada kuning, warna latar belakang elemen dengan ID "myParagraph" kepada hitam dan warna teks dalam elemen itu kepada putih. Selain itu, ia menambahkan sempadan hitam 1px pada semua elemen dengan kelas "bersempadan."

Atas ialah kandungan terperinci Mengapa Pengubahsuaian CSS jQuery Saya Tidak Berfungsi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!