บทความนี้แนะนำหลักการของการประมวลผลฟังก์ชั่นสกินเพจ JS (* จำเป็นต้องทดสอบและใช้ในสภาพแวดล้อมเซิร์ฟเวอร์*) สำหรับการอ้างอิงของคุณ เนื้อหาเฉพาะมีดังนี้
หลักการ:
1. การกำจัดผิวหนังคือการทำให้หน้าใช้การตั้งค่าสไตล์ที่ไม่ได้ใช้
2. เราสร้างไฟล์แผ่นหลายรูปแบบตามพื้นที่ทดแทนผิวหนัง
3. รับรหัสลิงค์
4. แก้ไขแอตทริบิวต์ HREF ของลิงก์เพื่อเปลี่ยนแผ่นสไตล์
5. ใช้แผ่นสไตล์โดยไม่ต้องใช้เพียงแค่ใช้สไตล์ผิวที่สอดคล้องกัน
6. การใช้หลักการของผู้ใช้ในการใช้เทคโนโลยีคุกกี้ผู้ใช้จะใช้การเลือกผิวครั้งสุดท้าย
7. การอ่านคุกกี้จะต้องเริ่มโหลดที่หน้าเพื่อให้แน่ใจว่า css ผิวที่สอดคล้องกันถูกโหลดล่วงหน้า
<html> <head> <title> ฟังก์ชั่นสกินเพจ JS </title> <meta charset = "utf-8"> <link href = "public.css" rel = "stylesheet" type = "text/css"/> <link href = " /*JS Page Function การประมวลผลฟังก์ชั่นการประมวลผล 1. การเปลี่ยนผิวหนังคือการตั้งค่าหน้าโดยไม่ต้องใช้การตั้งค่าสไตล์ 2 เราทำให้สถานที่ที่จะถูกแทนที่เป็นไฟล์แผ่นหลายสไตล์ตามผิวหนังโดยไม่ต้องใช้ 3. รับ ID ของลิงค์ 4 ปรับเปลี่ยนคุณลักษณะของการใช้งานแบบใช้ การเลือกผิวครั้งสุดท้าย 7. อ่านคุกกี้ที่จุดเริ่มต้นของการโหลดหน้าเว็บเพื่อให้แน่ใจว่า CSS ผิวที่สอดคล้องกันถูกโหลดล่วงหน้า *// // อ่านคุกกี้และการเปลี่ยนผิว var skin = document.getElementById ("ผิว"); // รับองค์ประกอบลิงค์ var skipval = readcookie ("skin"); if (! skipval) {// ถ้าคุกกี้ไม่มีสกินบันทึก href = "1.css";} else {skin.href = skipval+". css"; // มีบันทึก}; window.onload = function () {// คลิกปุ่ม var skin2 = document.getElementById ("skin2"); var skin3 = document.getElementById ("skin3"); var days = 30; // ตั้งค่าเวลาหมดอายุ var exp = new date (); exp.settime (exp.getTime () + วัน*24*60*60*1000); skin1.onclick = function () {skin.href = "1.css"; document.cookie = "skin = 1; expires ="+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 (); };}; // อ่านค่าที่ระบุของฟังก์ชั่นคุกกี้ readcookie (คีย์) {var skinval = false; var arrkv = cookieval.split (";"); สำหรับ (var i = 0; i <arrkv.length; i ++) {var itemc = arrkv [i] .split ("="); if (itemc [0] == key) {skinVal = itemc [1]; }อื่น{ }; - return skinval;}; </script> </head> <body> <div> <div> <อินพุตประเภท = "ปุ่ม" value = "skin1" id = "skin1"/> <อินพุต type = "button" value = "skin2" id = "skin2"/> <อินพุตประเภท = " Content2 </div> <div> ฉันเป็นเนื้อหา 3 </div> </div> <div> ฉันเป็นข้อมูลหาง </div> </body> </html>ดาวน์โหลดซอร์สโค้ด: http://xiazai.vevb.com/201607/yuanma/jschangeskin(vevb.com).rar
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการเรียนรู้ของทุกคนและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น