JavaScriptを使用して時間帯によってボタンを表示させたいです。

Question

実現したいこと

JavaScriptを使用して時間帯によってボタンを表示・非表示させたいです。
下記コードのようなイメージで
19:00〜9:59は非表示
10:00〜18:59は表示

時だけであれば、表示・非表示できると思うのですが、
分も含めるとすると、条件式の書き方がわからないです。

よろしくお願いします。

<div>
  <a><button id="button">開始する</button></a>
</div>
<div>
  <p>受付時間 10：00 - 19：00 </p>
</div>

該当のソースコード

$(function(){
    var now_hour = new Date().getHours();
    if ( 0 <= now_hour && now_hour <= 6 ){
        $('#button').css('display','none');
    } else if ( 7 <= now_hour && now_hour <= 12 ) {
        $('#button').css('display','block');
    } 
});

Comments

[kei344]

HTMLを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

Answer 1

【要注意！？JavaScriptの日付の比較の5つのTips | 侍エンジニア塾ブログ | プログラミング入門者向け学習情報サイト】
https://www.sejuku.net/blog/23115#Date-3

【時間帯によって処理を条件分岐させたい時のjQueryのサンプルコード | 福岡のホームページ制作・SEO対策ならアイドットデザイン】
https://idotdesign.net/blog/web/js/timezone-switch/

【時間帯によって表示する画像をかえてみよう - ５・６年生にもわかるやさしいJavaScript】
http://www.sky.sannet.ne.jp/masapine/java_gazou5.html

Answer 2

setIntervalで継続的にチェックすればいいかと思いますが
ユーザーのローカルPCの時計を参照するので、ユーザー側がずれていれば
意図せざるタイミングで表示されると思います。
ちゃんとやるならsetIntervalするとして、ajaxでサーバー側に表示するか否かを
問い合わせるというロジックが必要になるかもしれません