每一次的切換就會更改掉本地資訊,就不會因為重新整理而導致背景還原成預設狀態
但是!在這裡要注意一點就是,如果最開始沒有設定風格,就應該預設個預設樣式,通過查詢本地是否儲存的有該資料,如果沒有則使用預設的樣式
html
1css(有幾套樣式,我這裡就只發一套,有強迫症的朋友可以自己改一下)doctype html
>
2<
html
>
3<
head
>
4<
meta
charset
="utf-8"
/>
5<
meta
name
="viewport"
content
="width=device-width, initial-scale=1"
>
6<
title
>一鍵換膚
title
>
7head
>89
<
link
rel="stylesheet"
type
="text/css"
:href
=name
id="one"
/>
10<
link
rel="stylesheet"
type
="text/css"
href
="基礎結構.css"
id="only"
/>
11<
script
src=""
>
script
>
12<
body
>
13<
div
id=""
>
14<
div
class
="all"
>
15<
div
class
="header"
>
16<
span
>頭部導航欄
span
>
17div
>
18<
div
class
="content"
>
19<
span
>中部內容區
span
>
20div
>
21<
div
class
="foot"
>
22<
span
>
span
><
br>
23<
span
>背景風格切換
span
><
br>
24<
button
type
="button"
id="maiden"
>少女系
button
>
25<
button
type
="button"
id="ocean"
>海洋系
button
>
26<
button
type
="button"
id="brown"
>淺棕系
button
>
27<
button
type
="button"
id="forest"
>森林系
button
>
28div
>
29div
>
30div
>
31body
>
32<
script
src="background.js"
>
script
>
3334
html
>
1主體結構css.header
5.content
9.foot
13.all
1718
button
23button:active
1js(寫的可能重複**比較多,沒有去更好的優化)/*基本結構 */2
.all
7.header
14.content
21.foot
29.all
33button
1var list=[,,,]2//
提取3var name = localstorage.getitem("name"); 45
//判斷本地是否有儲存的資訊,如果沒有,則預設選擇
6if(name==undefined)
910 $('#one').attr("href",name);
1112
13 $('#maiden').click(() =>)
19 $('#ocean').click(() =>)
25 $('#brown').click(() =>)
31 $('#forest').click(() =>)
如何製作乙個簡單的機械臂
了解如何使用可通過外部電位器控制的伺服電機製作簡單的機械臂。機械人有多種形式,包括無人機 汽車 火星車,甚至步行者。讓機械人在其環境中移動非常重要,讓它與環境進行互動同樣重要。本文將向您展示如何製作乙個能夠通過外部電位器四處移動並指向物體的簡易機械臂。伺服電機 線性電位器 arduino uno開發...
如何在乙個成熟的應用內換膚?
全文無圖,請慎重閱讀,在16年10月我負責的應用實現了一次夜間模式,那次我基於各種調研結果自己寫了一套換膚框架,開源了一年,也有一些小夥伴用到了這套框架,能給大家提供點便利,還是挺開心的。不過本人懶癌已入膏肓,加上平時業務需求忙不過來,開源的框架的維護並沒做好,大家多多包涵。部分介面的layouti...
如何製作乙個vagrant box
因為要用的視窗應用,基於伺服器的各種box不能使用 曾經嘗試安裝桌面,沒有成功 所以試著基於ubuntu的虛擬機器建立自己的box。主要過程簡述如下 1 安裝virtualbox 2 安裝 vagrant root密碼 vagrant 使用者名稱 vagrant 使用者密碼 vagrant 4 完成...