如何使用数组中的id="tripDate“收集整个<td>内部的html，并用当前日期检查每个td值

Question

如何使用id="tripDate“在数组中收集整个td的内部html，并使用JavaScript或jquery检查每个td值与当前日期的关系。

<table class="w3-table-all w3-small w3-responsive"> 
    <thead>
        <tr class="w3-green">
            <th style="padding:15px; font-weight:bold;">Departure Dates</th>
            <th style="padding:15px; font-weight:bold;">Departure Availablity</th>
            <th style="padding:15px; font-weight:bold;">Trip Cost</th>
            <th style="padding:15px; font-weight:bold;">Inquiry</th>
        </tr>
    </thead> 
     <tr class="w3-hover-pale-green">
        <td id="tripDate"><?=$ddate1='March, 21, 2017 - April, 06, 2017'?></td>
        <td class="available">Available</td>
        <td>USD$ 1250.00</td>
        <td><a class="w3-btn w3-small w3-green w3-hover-green fancybox fancybox.iframe" href="<?=ROOTDIR.$_PHPLIB['contact']?>index.php?trpName=<?=$tripName?>&trpDate=<?=$ddate1;?>&trpUrl=<?=$actual_link;?>">Inquiry</a></td>
     </tr>       
     <tr class="w3-hover-pale-green">
        <td id="tripDate"><?=$ddate1='March, 28, 2017 - April, 13, 2017'?></td>
        <td class="available">Available</td>
        <td>USD$ 1250.00</td>
        <td><a class="w3-btn w3-small w3-green w3-hover-green fancybox fancybox.iframe" href="<?=ROOTDIR.$_PHPLIB['contact']?>index.php?trpName=<?=$tripName?>&trpDate=<?=$ddate1;?>&trpUrl=<?=$actual_link;?>">Inquiry</a></td>
     </tr>
     <tr class="w3-hover-pale-green">
        <td id="tripDate"><?=$ddate1='April, 04, 2017 - April, 20, 2017'?></td>
        <td class="available">Available</td>
        <td>USD$ 1250.00</td>
        <td><a class="w3-btn w3-small w3-green w3-hover-green fancybox fancybox.iframe" href="<?=ROOTDIR.$_PHPLIB['contact']?>index.php?trpName=<?=$tripName?>&trpDate=<?=$ddate1;?>&trpUrl=<?=$actual_link;?>">Inquiry</a></td>
     </tr>  
</table>

var currentDate = new Date();   
var IDs = [];

$('.w3-table-all').find("td[id='tripDate']").each(function() { 
    IDs.push(this.id);
});

$.each(IDs, function(index, value) {
    var actualDates = document.getElementById(value).innerHTML;
    // didn't get all the values something went wrong ?????
    if (actualDates < currentDate) {
        //do something good
    }   
}); 

Answer 1

您可以像下面这样迭代：

var now = new Date();

 $(".w3-table-all td[id='tripDate']").each(function() {
        var currentTripDateRange = this.innerText
          , currentTripDates = currentTripDateRange.split(' - ')
          , startDate =Date.parse(currentTripDates[0])
          , lastDate =Date.parse(currentTripDates[1]);

      if(now >= startDate && now <= lastDate){
          //here is your selected dateRange
          log(currentTripDateRange);
      }
    });

在这里找到工作代码：http://jsbin.com/juqomonuci