javascript - クリックして項目の色を変更するにはどうすればよいですか?

Question

私はプログラミングが初めてで、クリックしたときにアイテムの色を一連の色に変更したいと考えています。これは、CSS、javascript、または JQuery を使用して実行できると思います。どれが最も効率的でしょうか?

Answer 1

簡単な例を次に示します。colorableクリックすると、そのクラスを含むすべての要素に別のクラスがred追加され、テキストの色が変わります。

jsフィドル

HTML

<div class="colorable">Color me in</div>

CSS

.red {
    color:red;
}

JavaScript (jQuery を使用)

$('.colorable').click(function () {
    $(this).addClass('red');
});

Answer 2

ランダムな色にしたい場合は、次のようにします。

HTML

<div id="button">Button</div>

CSS

div { user-select: none; }

JavaScript

var button = document.getElementById('button');

button.addEventListener('click', changeColor, false);

function changeColor() {
    this.style.color = '#'+Math.floor(Math.random()*16777215).toString(16);
}

jsフィドル