I’m trying to create SELECT box that changes all dates (yyyy-mm-dd hh:ii) on a page containing unformatted HTML
There is some problem assigning value to formattedDate
EDIT: the code works only in newer browsers, so I’d like to make it compatible with say 2014 browsers.
function switchTZ() {
const tz = document.getElementById("tz").value;
const updatedText = document.body.innerHTML
.replace(/b(d{4}-d{2}-d{2}) (d{2}:d{2})b/g, (match, datePart, timePart) => {
const local = new Date(datePart+'T'+timePart+':00+01:00');
const formattedDate = new Intl.DateTimeFormat('en-GB',
{
timeZone: tz,
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
hour12: false
}).format(local);
return formattedDate.replace(",", "");
});
document.body.innerHTML = updatedText;
}
<select id="tz" onchange="switchTZ()">
<option value="America/Mexico_City">America/Mexico_City</option>
<option value="America/New_York">America/New_York</option>
<option value="America/Sao_Paulo">America/Sao_Paulo</option>
<option value="Asia/Seoul">Asia/Seoul</option>
<option value="Asia/Tokyo">Asia/Tokyo</option>
<option value="Europe/Berlin">Europe/Berlin</option>
</select>
<p>27807;2023-10-20 01:30<br />27808;2023-10-21 01:30</p>