2
私はコースホームの仕事をしようとしていますが、私はYouTubeのビデオからこれを書いていますが、動作していません！それは約2つのボタンをHTMLページに追加してクラスをCSSに切り替えるだけでなく、ローカルストレージAPIを使用してローカルの最後の選択肢を保存し、最後に選択したページをロードするときにロードします。JavascriptローカルストレージAPIのテーマスイッチが動作しない
function applyTheme (theme) {
"use strict"
\t document.getElementById("mypage").className = theme;
\t localStorage.setItem ("theme", theme); \t
}
function applyDayTheme() {
"use strict"
\t applyTheme("day");
}
function applyNightTheme() {
"use strict"
\t applyTheme("night");
}
function addButtonLestenrs() {
"use strict"
\t document.getElementById("b1")addEventListener("click", applyDayTheme);
\t document.getElementById("b2")addEventListener("click", applyNightTheme);
}
function initiate(){
"use strict"
\t if(typeof(localStorage)===undefined)
\t \t alert("the application can not be executed properly in this browser");
\t else{
\t \t if(localStorage.getItem("theme")===null)
\t \t \t applyDayTheme();
\t \t else
\t \t \t applyTheme(localStorage.getItem("theme"));
\t \t
\t }
\t addButtonLestenrs();
}
initiate();.day{
color:black;
background-color:lightgrey;
}
.night{
color:white;
background-color:black;
}<!DOCTYPE html>
<html>
<head>
\t <meta charset="utf-8">
\t <link rel="stylesheet" href="css/style.css">
\t
</head>
<body id="mypage">
\t <h1>Choose a theme</h1>
\t <button id="b1">Theme day</button>
\t <button id="b2">Theme night</button>
\t
\t <p> This is an example of use of HTML5 storage API </p>
<script type="text/javascript" src="js/script.js">
</body>
</html>
ありがとうございましたAbdoutelb私は "。" 「厳しい」を使用してもまだ動作していません –
@HilalPcnador私はあなたのコードをここに入れます https://codepen.io/anon/pen/owxEBE#0 – abdoutelb
それは今働いていて、もありませんでした:-Dありがとうとても –