Home > Mobile >  Get specific part of querySelector(x).innerText
Get specific part of querySelector(x).innerText

Time:10-20

So I'm trying to automate a task in Puppeteer, and one of the things I want to do involves getting the time as text. I found the original way too complicated so I opted for this method as the Date and Time is already there, just have to isolate the time.

Running this in the web console:

document.querySelector('div[]').innerText;

gets me this (for this time, next time I go through the process, it'll show a different time assuming I refill out the form and the time updates).

'Tuesday, October 19, 2021 5:48 PM'

The Question: Is there any way to specifically isolate the 5:48 PM part no matter what comes before the time?

EDIT: The two methods posted do work (technically, assuming you're entering it into the web console yourself.) but Puppeteer's having issues (or I just have no clue how to implement it in Puppeteer, probably the latter).

Update 2 (because somehow I couldn't put 1 and 1 together quickly): instead of declaring the const TimeRX, I just removed it and just substituted TimeRX for the RegExp. This was what that line ended up as:

const time = await page.evaluate(()=>document.querySelector("div.h1.text-success").textContent.match(/\d{1,2}:\d{2} (AM|PM)/i)?.[0]);

I'll probably end up changing the RegExp for the other recommended one.

CodePudding user response:

Capture it with a regex?

const twelveHourTimeRx = /(1[0-2]|(?<!\d)[1-9]):[0-5]\d ?(AM|PM)/i
// or the much simpler but less valid /\d{1,2}:\d{2} (AM|PM)/i

const time = document.querySelector("div.h1.text-success")
  .textContent.match(twelveHourTimeRx)?.[0]
  
console.log("time", time)
<div class="h1 text-success">
  Tuesday, October 19, 2021 5:48 PM
</div>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Note that I've used a much more forgiving selector to locate your <div>. Your original one requires the class attribute to be exactly "h1 text-success" but using .h1.text-success means that there can be other classes and in any order.

CodePudding user response:

You can split the string by a space and get the last two items:

const str = document.querySelector('.h1.text-success').textContent
const res = str.split(' ').slice(-2).join(' ')

console.log(res)
<div class="h1 text-success">Tuesday, October 19, 2021 5:48 PM</div>
<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

  • Related