javascript - 使用 javascript 或 jquery 突出显示域到期月份之前的行

Question

我想突出显示基于 TH 日期和时间的域名到期月份之前的行 <td>2017-04-14 17:21:00</td>使用 javascript 或 jquery

<table>
  <tr>
    <th>Domain</th>
    <th>Renewal Date</th>
  </tr>
  <tr>
    <td>mydomain.com</td>
    <td>2017-04-14 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2017-08-14 17:21:00</td>
  </tr>
</table>

Answer 1

这是我们正在做的:

1. 创建 Date今天的对象。
2. 获取所有有日期的td。目前确定为第二个 td。
3. 获取到期日期并使用该字符串创建一个 Date 对象。
4. 使用今天的 Date 对象为从现在开始的一个月创建一个 Date 对象，并将该日期加上 1 个月。
5. 检查到期日期是在今天之前还是在下个月内，并分配适当的高亮类。
6. 检查是否设置了高亮，如果设置了，则将类添加到元素中。

请注意，此解决方案增加了两个不同的亮点。

1. 从现在起一个月内到期。
2. 过期日期。

var today     = new Date(),
    toISO8601 = function ( dateStr, offset ) {
        return dateStr.replace( ' ', 'T' ) + ( offset ? offset : 'Z' );
    };

$( 'td:nth-child( 2 )' ).each( function( i, el ) {

  var $el       = $( el ),
      expireStr = toISO8601( $.trim( $el.text() ), '-05:00' ),
      expires   = new Date( expireStr ),
      inAMonth  = new Date( today.getTime() ),
      highlight;
      
  inAMonth.setMonth( inAMonth.getMonth() + 1 );

  highlight = expires < today ? 'has-expired' :
              expires < inAMonth ? 'about-to-expire' :
              false;
                  
  if ( highlight ) {
  
    $el
      .parent()
      .addClass( highlight );
      
  }  

} );

.has-expired {
  background-color: indianred;
}
.about-to-expire {
  background-color: pink;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <th>Domain</th>
    <th>Renewal Date</th>
  </tr>
  <tr>
    <td>mydomain.com</td>
    <td>2017-04-14 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2017-08-14 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2017-03-10 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2017-04-15 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2018-06-28 17:21:00</td>
  </tr>
  <tr>
    <td>mydomain.net</td>
    <td>2017-04-17 10:21:00</td>
  </tr>
</table>

你可以使用 toISOString() ，即 expires.toISOString()，而不是我的 toISO8601() 方法，但 toISOString() 将返回我的函数允许的 UTC 时间您可以确定您自己时区的偏移量(回退到 UTC)。

时间可能是一件棘手的事情，根据您的需要，您可能需要像 moment.js 这样的库。 .