Javascript If/Else＆setAttribute

Question

頭が上がっているように、私は非常に初心者なので、なぜ私がこの特定のやり方でやっているのかについてあまり考える前に、私は練習し、私ができることとできないこと、機能を書くこと、そして方法を使うことについて把握しようとしています。もちろん、私はただの提案ではありません。私は、誰かが私が最良の方法ではないかもしれないことで何かをやっているという事実に巻き込まれないようにしたくありません。質問に。

要約すると、私はいくつかのJSを書いてCSSファイルを交換し、ウェブサイト上のテーマを変更しようとしています。ここで

はHTMLです：

<div onclick="swapStyleSheet('css/styles-black.css')" class="onoffswitch"> 
    <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked> 
    <label class="onoffswitch-label" for="myonoffswitch"></label> 
</div> 

次のコードが動作するようです：

function swapStyleSheet(sheet){ 
    if (document.getElementById('pagestyle').getAttribute('href') == "css/styles-white.css") { 
    document.getElementById('pagestyle').setAttribute('href', "css/styles-black.css"); 
    } 
} 

私はこれは私が直接、 "CSS /スタイル-black.css" に設定するかどうかを動作することに注意しましょう関数呼び出しによって引数を渡すことができます（HTMLに見られるように）。スタイル-white.cssにスタイル-black.cssから戻るには

、私は他の文を追加しました：

function swapStyleSheet(sheet){ 
    if (document.getElementById('pagestyle').getAttribute('href') == "css/styles-white.css") { 
    document.getElementById('pagestyle').setAttribute('href', "css/styles-black.css"); 
    } else { 
    document.getElementById('pagestyle').setAttribute('href', "css/styles-white.css"); 
    } 
} 

これは動作しませんし、私はその理由を把握しようとしています。デフォルトでは、styles-white.cssスタイルを使用するように設定されています。私は何が欠けていますか？私は、それが初心者のために見逃しやすい小さなもののようなものだと感じています。

ありがとうございます。

Answer 1

私はjQueryを使って、この作品を作ることができた：

$(".onoffswitch").click(function(){ 
    if($('.onoffswitch-checkbox').is(':checked') == false) { 
     $("#pagestyle").attr("href", "css/styles-black.css"); 
    } else if ($('.onoffswitch-checkbox').is(':checked') == true) { 
     $("#pagestyle").attr("href", "css/styles-white.css"); 
    } 
}) 

私は私ではない実現するよう、すべてのページは次のようになり、また、それが少し特定のhref程度であることを別の方法を動作させることができました私はまだ、これはバニラJSで動作するように取得する方法を見つけ出すしたい

$(".onoffswitch").click(function(){ 
    if($('.onoffswitch-checkbox').is(':checked') == false) {    
     $("#pagestyle").attr('href', function(i, blackCSS) { 
      return blackCSS.replace('white', 'black');     
     });    
    } 
}); 

：CSS /スタイル-white.cssが適切であろうようにあります。私はそれが私が間違っていると確信しています。しかし、何らかの解決策を見つけ出すことができてとても嬉しかったです。