html - 更新時にdivの背景色を変更する

Question

ランディングページのコンセプトに取り組んでいます。そして、リフレッシュするたびに（jQueryを使用して）Divの背景色を変更したいと考えています。で、いろいろやってみましたがだめでした。

私はJavascriptの経験があまりありません。

Answer 1

このjQueryを試してください:)

$(document).ready(function() {
    $('#mydivid').css("background-color", getRandomColor());
}

function getRandomColor() { 
    var letters = '0123456789ABCDEF'.split(''); 
    var color = '#'; 
    for (var i = 0; i < 6; i++ ) { 
        color += letters[Math.round(Math.random() * 15)]; 
    } 
    return color; 
} 

Answer 2

提案されているように、リロードごとにランダムな色を使用できます。色を確実に変更したい場合は、前の値を使用するlocalStorageかsessionStorage、覚えておくことができます。

例：

$(function(){
  var prevColorId = sessionStorage.getKey("colorID"); //undefined if not present
  var colorList = ["lightRed", "lightGreen", "lightBlue" /*, ...*/];
  var nextColorId = prevColorId+1; //NaN if prevColorId undefined
  if(colorList[nextColorId]===undefined){
    nextColorId=0;
  }
  sessionStorage.setKey("colorID");
  $("#myRainbowDiv").css({background: colorList[nextColorId]});
}