JSFiddle - React, Tailwind, and code Playground

by 380mi

HTML

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <ul>
    <li id="__target" data-showDate="2019/12/2" style="display:none;">項目1</li>
    <li>項目2</li>
    <li>項目3</li>
  </ul>
  <script>
  	//-----------------------------------
    // 現在時刻をUNIXタイムで取得
    //-----------------------------------
    let _now  = new Date(),
        now_y = _now.getFullYear(),
        now_m = _now.getMonth() + 1,
        now_d = _now.getDate(),
        now_h = _now.getHours(),
        now_i = _now.getMinutes(),
        now_s = _now.getSeconds();
    let now = now_y + '/' + now_m + '/' + now_d + ' ' + now_h + ':' + now_i + ':' + now_s;
    // UNIXタイムスタンプで取得
    let ux_now = Date.parse(now.replace( /-/g, '/')) / 1000;

    //-----------------------------------
    // 指定日付をUNIXタイムで取得
    //-----------------------------------
    let _showDate = document.getElementById('__target').getAttribute('data-showdate').split('/');
    let showDate = _showDate[0] + '/' + _showDate[1] + '/' + _showDate[2] + ' 0:0:0';

    // UNIXタイムスタンプで取得
    let ux_showDate = Date.parse(showDate.replace( /-/g, '/')) / 1000;

    // アクセス現在時刻が指定時刻を超えてたらSHOW
    if ( ux_showDate < ux_now ) {
        document.getElementById('__target').style.display = '';
    }  
  </script>
</body>
</html>