1 |
<span class="cm-variable-2">msg</span>.<span class="cm-property">style</span>.<span class="cm-property">backgroundColor</span> <span class="cm-operator">=</span> <span class="cm-string">'rgb('</span> <span class="cm-operator">+</span> <span class="cm-variable-2">r</span> <span class="cm-operator">+</span><span class="cm-string">','</span> <span class="cm-operator">+</span> <span class="cm-variable-2">g</span> <span class="cm-operator">+</span> <span class="cm-string">','</span> <span class="cm-operator">+</span> <span class="cm-variable-2">b</span> <span class="cm-operator">+</span> <span class="cm-string">')'</span>; |
の意味が分からないが、とりあえず書いてみた。
まずは、それぞれのスライダーから値を取り出す。
var r = document.querySelector('#red').value;
var g = document.querySelector('#green').value;
var b = document.querySelector('#blue').value;
もちろん
var msg = document.querySelector('#msg');
で、id="msg"のDOMオブジェクトも変数msgに格納して、
msg.style.backgroundColor = 'rgb(' + r +',' + g + ',' + b + ')';
msgオブジェクトのstyleのbackgroundColorにそれぞれのrgbの値を代入している。
しかし、なぜ ' + ' を付けるのかが不明のままである。