2017-09-18 7 views
1

このカラーはどのようにして複数の色にすることができますか?また、私は色を変えるためのリンクを得ることができません。カラーチェンジャーは2色しか使用していません

var div = document.getElementById('ColorChanger'); 
 
div.addEventListener('click', function(e){ 
 
    var self = this, 
 
     old_bg = this.style.background; 
 
    
 
    document.body.style.background = document.body.style.background=='black'? 'white':'black'; 
 
    document.body.style.color = document.body.style.color=='lime'? 'black':'lime'; 
 
    document.alinkColor = document.linkcolor=='red'? 'black':'red'; 
 
    
 
})
<div id="ColorChanger">A+</div> 
 

 
<a href="#"> 
 
Test 
 
</a>

+0

この問題は何ですか? –

+0

もっと多くのオプションがあれば、簡潔さを失うことは避けられないと思います。複数のif/else ifステートメントまたはもう少しエレガントなswitchステートメントを使用できます。 –

+0

A +をクリックして背景が黒くなったとき、リンクが私の色を変えました。あなたはもっと色をどういう意味ですか?あなたは背景やリンクを変えるクリック可能なものを色々に持っていますか?もしそうなら、あなたはそれらのすべてのためにあなたがA +のためにしたことを単にコピーしてください。 A +を複数の色に変更しますか?それではどうですか?無作為に?ユーザーに決定させますか? –

答えて

1

あなたは、このようなアレイ内のすべてのあなたの色を保存することができます:それはあなたがのpreventDefaultを使用shoulリンクを動作させるために

var div = document.getElementById('ColorChanger'); 
var allColors = []; 
var currentColor = 0; 
allColors.push({bg:"red",front:"green"}); 
allColors.push({bg:"green",front:"yellow"}); 
allColors.push({bg:"purple",front:"white"}); 

div.addEventListener('click', function(e){ 
    var self = this, 
     old_bg = this.style.background; 

    document.body.style.background = allColors[currentColor].bg; 
    document.body.style.color = allColors[currentColor].front; 
    currentColor++; 
if(currentColor == allColors.length) currentColor = 0; 
}) 

関連する問題