//for jquery
//after document load
$(document).ready(function() { //same as: $(function() {
alert("hi 1");
});
//after full window load including image src css file
$(window).load(function() {
alert("hi 2");
});
<script defer src="app.js"></script>
document.addEventListener('readystatechange', event => {
// When HTML/DOM elements are ready:
if (event.target.readyState === "interactive") { //does same as: ..addEventListener("DOMContentLoaded"..
alert("hi 1");
}
// When window loaded ( external resources are loaded too- `css`,`src`, etc...)
if (event.target.readyState === "complete") {
alert("hi 2");
}
});