環境

js
javascript
html5
jQuery
時間
処理
分岐

説明

時間帯によって画面の背景色を変えるスクリプトです。jQueryを使ってます。各々用意してください。

実装

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>時間帯によって処理を分岐させる</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">

$(function(){
    var now_hour = new Date().getHours();
    console.log(now_hour)
    if ( 0 <= now_hour && now_hour <= 6 ){
        $('body').css('background','red');
        //0時から6時までは赤


    } else if ( 7 <= now_hour && now_hour <= 12 ) {
        $('body').css('background','blue');


    } else if ( 13 <= now_hour && now_hour <= 15) {
        $('body').css('background','green');


    } else if ( 16 <= now_hour && now_hour <= 23) {
        $('body').css('background','yellow');
    }
});
</script>
</body>
</html>

参考

時間帯によって処理を条件分岐させたい時のjQueryのサンプルコード

Pocket

Share on Tumblr