Bagaimanakah Saya Boleh Menggunakan CSS Sebaris atau Luaran secara Dinamik dengan jQuery untuk Kandungan AJAX?

Menggunakan CSS Sebaris atau Luaran Secara Dinamik dengan jQuery

Apabila menyepadukan kandungan Ajax ke dalam halaman menggunakan jQuery, ia menjadi perlu untuk mengurus CSS yang digunakan kepada kandungan itu. Artikel ini meneroka kaedah untuk menggunakan CSS sebaris atau memuatkan helaian gaya CSS luaran secara dinamik untuk memastikan persembahan kandungan yang dimuatkan dengan betul.

Masalah

Memuatkan kandungan Ajax ke dalam pop timbul Yahoo menggunakan Kaedah .get jQuery menyebabkan isu dengan CSS yang dijana secara dinamik digunakan. Chrome tidak menilai CSS yang ditambahkan pada sebaris DOM, tetapi Internet Explorer menilai. Mencari cara untuk menilai CSS dimuatkan secara dinamik sama ada dalam talian atau luaran adalah penting.

Penyelesaian

jQuery menyediakan beberapa kaedah untuk memuatkan dan menilai CSS secara dinamik:

Memuatkan CSS Sebaris dengan AJAX

$.get(myStylesLocation, function(css) {
   $('<style type="text/css"></style>')
      .html(css)
      .appendTo("head");
}); 

Memuatkan CSS Luaran dengan Dibuat Secara Dinamik

$('<link rel="stylesheet" type="text/css" href="'+myStylesLocation+'">')
   .appendTo("head");

Memuatkan CSS Luaran dengan Dicipta Secara Dinamik

$('<style type="text/css"></style>')
    .html('@import url("' + myStylesLocation + '")')
    .appendTo("head");

$('<style type="text/css">@import url("' + myStylesLocation + '")</style>')
    .appendTo("head");

Kaedah ini membenarkan pemuatan dinamik dan penilaian CSS untuk kandungan yang dimuatkan secara tidak segerak, memastikan penggayaan dan pembentangan kandungan yang dimuatkan dengan betul kepada pengguna.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan CSS Sebaris atau Luaran secara Dinamik dengan jQuery untuk Kandungan AJAX?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!