ローカルストアのスワップスタイルシート

私はデザイナーであり、JSは私にとって全く外国人です。私はリフレッシュ後、選択したスタイルシートのローカル保存をしたいと思います。私は、スタイルシートを交換するためのコードを見つけることができたが、私はローカルストアのスワップスタイルシート

<!DOCTYPE html> 
<html> 
<head> 
<link id="pagestyle" rel="stylesheet" type="text/css" href="style1.css"> 
<script> 

function swapStyleSheet(sheet){ 
    document.getElementById('pagestyle').setAttribute('href', sheet); 
} 


</script> 


</head> 
<body> 
<h2>Javascript Change StyleSheet Without Page Reload</h2> 
<button onclick="swapStyleSheet('style1.css')">Dark Style Sheet</button> 
<button onclick="swapStyleSheet('style2.css')">Blue Style Sheet</button> 
<button onclick="swapStyleSheet('style3.css')">Default Style Sheet</button> 
</body> 
</html>

出典

2017-12-10 BenC

がここにそれをチェック。 https://stackoverflow.com/a/26417800/4913153 – Thinker

[localStorageを使用してCSSスタイルシートを永続性で切り替える]（https://stackoverflow.com/questions/26417764/using-localstorage-for-switching-css）の可能な複製-style-sheets-with-persistence） –

のlocalStorageを使用するように追加してどのようなコードわからないんだけど、あなたがこのコードを使用することができます

<script> 
    var swapStyleSheet = function (sheet) { 
     document.getElementById('pagestyle').setAttribute('href', sheet); 
     storebackground(sheet); 
    } 

    var storebackground = function (swapstylesheet) { 
     localStorage.setItem("sheetKey", swapstylesheet); //you need to give a key and value 
    } 

    var loadbackground = function() { 
     document.getElementById('pagestyle').setAttribute('href', localStorage.getItem('sheetKey')); 
    } 

    window.onload = loadbackground(); 
</script>

出典

2017-12-10 08:40:19

ありがとうございました！この作品 – BenC

ローカルストアのスワップスタイルシート

答えて

関連する問題