Tips

* {
    outline: 1px solid red !important;
}
* {
    outline: 1px solid red !important;
    opacity: 1 !important;
    visibility: visible !important;
}
			

a:focus-visible,button:focus-visible{outline: 2px auto #000 !important;outline-offset: 2px !important}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:thin dotted !important;}
			

$.fn.jquery
			

$( document ).ready(function() {

});
			

$(function() {

});
			

document.lastModified
			

<script type="text/javascript" src="script.js"></script>

<!-- adding 'defer' to load after HTML has been loaded -->
<script type="text/javascript" src="script.js" defer></script>
			

<button popovertarget="menu">Toggle menu</button>
<div id="menu" popover>
    <p>Menu context</p>
</div>
			

prefers-color-scheme
			

orientation: landscape
orientation: portrait
@media (orientation: landscape) and (max-width: 812px)
			

Immediately Invoked Function Expression (IIFE)

(function() { ... })();
			

Vs not

// define function
function() { ... }

// call function
function(value1, value2 );
			

Output as JSON

const data = JSON.stringify(dailyData);

const data = JSON.stringify(dailyData, null, 2);
			

What is this?

const timeString = "06:26 AM";
// Create a dummy date object to parse the time
const [time, modifier] = timeString.split(' ');
let [hours, minutes] = time.split(':');
const date = new Date();
date.setHours(hours);
date.setMinutes(minutes);

// Format to "6:26 AM"
const formattedTime = date.toLocaleTimeString('en-US', {
  hour: 'numeric',
  minute: '2-digit',
  hour12: true
});
console.log(formattedTime); // "6:26 AM"