comparing a date string with current Date()

Question

So, I already have a variable that holds all the cells in a certain column. each cell contains, as it's innerText, a timestamp formatted like such, yyyy-mm-dd hh:mm in 24h format.

How do I go about comparing the string that I have with Date() to see if the string is within the next hour?

I was thinking a for loop to go through the array with an if function inside saying "if the time shown is within an hour of the current time then change the background color of the cell to red.

for(var i=0; i<column.length;i++){
  if(column[i].innerText - Date() < 1hr){   //this line needs work
    column[i].style.backgroundColor='#ff000';
  } else(){
    }
};

I'm sure there probably needs to be some parse method used or something but I'm not too familiar with it.

note: I'm using Tampermonkey to inject the code into a page I have no control over and so the timestamps are as the come.

score 0 · Answer 1 · answered Nov 18 '18 at 01:53

0

Change this:

if(column[i].innerText - Date() < 1hr){

To this:

var hourNow = new Date().getHours();
var hourColumn = Number(column[].innerText.split("")[11] + "" + column[].innerText.split("")[12]);
if (hourNow + 1 >= hourColumn || hourColumn + 1 <= hourNow) {

And it should work.

answered Nov 18 '18 at 01:53

Jack Bashford

43,180
11
50
79

1st: i expect you mean column[i] when splitting and not just column[]. 2nd: this doesn't work correctly if the date in the column isn't the same as the current date. ie column:4th while current date: 3rd. – Pshock13 Nov 18 '18 at 02:35

Burak · Accepted Answer · 2018-11-18T15:45:50.493

0

Date constructor does the job of parsing for you. So something like this would be all you need:

hour = 3600000 //1 hour in ms
nextHour = new Date(column[i].innerText) - new Date()
if(nextHour <= hour && nextHour >= 0) {
    //Your code here
}

Explanation:

Since Javascript Date is based on milliseconds since midnight January 1, 1970, - (minus) operator allows you to treat it as a Number and returns the resulting number as a Number.

edited Nov 18 '18 at 15:45

answered Nov 18 '18 at 02:44

Burak

73
6

is there a way to compare the DAY as well, because I dont see how using .getHours() would help if the day in the column is after the current date. – Pshock13 Nov 18 '18 at 02:47
You are correct. However the second case should fully cover this as it measures the time difference between two dates. – Burak Nov 18 '18 at 02:48
@Pshock13 I have now removed the first solution as it was faulty in so many ways. The current solution should work as it is though. – Burak Nov 18 '18 at 02:52
you need `var` in front of declaring your variables, but also, I tried making a new `var test = new Date(column[i].innerText)`. doing `console.log(test)` inside my for loop returns invalid date for each one. – Pshock13 Nov 18 '18 at 03:01
1

@Pshock13 that shouldn't happen if your dates are in the format you say. It might help to post the *actual* date string in the question. – Mark Nov 18 '18 at 03:02
`2018-11-18 03:00` is an innerText i just pulled from the console – Pshock13 Nov 18 '18 at 03:09
@Pshock13 Does `console.log(new Date('2018-11-18 03:00'))` give you an invalid date? – Mark Nov 18 '18 at 03:22
found it! I had `.innertText` with an extra 't'. I knew something was wrong because `new Date(column[i].innerText) - new Date();` was giving me time in ms. – Pshock13 Nov 18 '18 at 03:31
"yyyy-mm-dd hh:mm" is not a format supported by ECMAScript so parsing is implementation dependent. At least one current browser will return an invalid Date. – RobG Nov 18 '18 at 08:15
"*+ and - operators allow you to treat it as a Number*" is incorrect, try `new Date() + 5`. – RobG Nov 18 '18 at 08:22

Sivakumar Tadisetti · Answer 3 · 2018-11-18T03:27:28.927

-1

You can go with below approach. Here I have used getUTCHours(), because new Date(new Date(columns[i].innerText) - new Date()) will give UTC timestamp. You can find the explanation about UTC timestamp from here

var columns;

function changecolors() {
  columns = document.getElementsByClassName('column');
  for (var i = 0; i < columns.length; i++) {
    if (new Date(new Date(columns[i].innerText) - new Date()).getUTCHours() < 1) {
      columns[i].style.backgroundColor = '#ff0000';
    }
  };
}

<div class="column">2018-11-18 09:30</div>
<div class="column">2018-11-18 11:00</div>

<button onclick="changecolors()">Change Colors</button>

edited Nov 18 '18 at 03:27

answered Nov 18 '18 at 03:15

Sivakumar Tadisetti

4,865
7
34
56

1

"yyyy-mm-dd hh:mm" is not a format supported by ECMAScript so parsing is implementation dependent. At least one current browser will return an invalid Date. – RobG Nov 18 '18 at 08:25

comparing a date string with current Date()

3 Answers3