Artikel ini memperkenalkan prinsip pemrosesan fungsi skinning halaman JS (* perlu diuji dan digunakan dalam lingkungan server*) untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
prinsip:
1. Penghapusan kulit adalah membuat halaman menggunakan pengaturan gaya yang tidak digunakan
2. Kami membuat beberapa file lembar gaya berdasarkan area penggantian kulit.
3. Dapatkan ID Tautan
4. Ubah atribut HREF dari tautan untuk Mengubah Lembar Gaya
5. Gunakan lembar gaya tanpa menggunakannya, cukup gunakan gaya kulit yang sesuai
6. Menggunakan prinsip pengguna menggunakan teknologi cookie, pengguna juga akan menggunakan pilihan kulit terakhir
7. Membaca Cookie Harus Mulai Memuat di Halaman Untuk memastikan bahwa CSS kulit yang sesuai dimuat terlebih dahulu
<html> <head> <title> js halaman skinning halaman </itement> <meta charset = "utf-8"> <tautan href = "public.css" rel = "stylesheet" type = "text/css"/> <link href = "1.css" rel = "stylesheet" type "/css/css =" cript "<ckss" <"stylesheet" TEXS = "ccrip" cript "css =" scrips "<ckss" <stylesheet "type"/css = ccreck = "ccrip" <cks "<" TEXT "TEXT" TEXS/CSS = "CRIPT" "TEKS" "TEKS =" TEXS "TEKS =" TEXS "TEKS =" TEXS " /*Js halaman prinsip pemrosesan fungsi skinning 1. Penggantian kulit adalah untuk mengatur halaman tanpa menggunakan pengaturan gaya 2. Kami membuat tempat yang akan diganti menjadi beberapa file lembar gaya sesuai dengan kulit tanpa menggunakannya 3. Dapatkan ID tautan 4. Ubah Teknologi Penggunaan HREF yang akan digunakan untuk mengubah Lembar Kulit. Pilihan kulit 7. Baca cookie di awal pemuatan halaman, memastikan bahwa CSS kulit yang sesuai dimuat sebelumnya */// Baca cookie, dan ganti kulit var skin = document.getElementById ("skin"); // Dapatkan elemen tautan var cookieval = document.cookie; var skipval = readCookie ("skin"); if (! skipval) {// Jika cookie tidak memiliki rekaman skin.href = "1.css";} else {skin.href = skipval+". css"; // Ada catatan}; window.onload = function () {// klik tombol untuk mengganti kulit var skin1 = document. var skin2 = document.geteLementById ("skin2"); var skin3 = document.geteLementById ("skin3"); var hari = 30; // atur waktu kedaluwarsa, var exp = tanggal baru (); exp.settime (exp.getTime () + hari*24*60*60*1000); skin1.onClick = function () {skin.href = "1.css"; document.cookie = "skin = 1; kedaluwarsa ="+exp.toutcstring (); }; skin2.onClick = function () {skin.href = "2.css"; document.cookie = "skin = 2; Expires ="+exp.toutcString (); }; skin3.onClick = function () {skin.href = "3.css"; document.cookie = "skin = 3; Expires ="+exp.toutcString (); };}; // Baca nilai yang ditentukan dari fungsi cookie readCookie (key) {var skinval = false; var arrkv = cookieval.split (";"); untuk (var i = 0; i <arrkv.length; i ++) {var itemc = arrkv [i] .split ("="); if (itemc [0] == key) {skinVal = itemc [1]; }kalau tidak{ }; }; return skinval;};</script></head><body><div> <div> <input type="button" value="skin1" id="skin1" /> <input type="button" value="skin2" id="skin2" /> <input type="button" value="skin3" id="skin3" /> </div></div><div> <div>I am content1</div> <div>I am content2 </div> <div> Saya konten3 </div> </div> <div> Saya informasi ekor </div> </body> </html>Unduh Kode Sumber: http://xiazai.vevb.com/201607/yuanma/jschangeskin(vevb.com).rar
Di atas adalah semua konten artikel ini. Saya berharap ini akan membantu untuk pembelajaran semua orang dan saya harap semua orang akan lebih mendukung wulin.com.