DOMContentLoaded is an event in the browser that fires when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading. This means that the DOM (Document Object Model) is fully constructed and can be manipulated.
Key Points:
- Timing: It occurs after the HTML is loaded but before all resources (like images) are fully loaded.
- Usage: It's commonly used to run scripts that manipulate the DOM, ensuring that the elements you want to interact with are available.
Example:
document.addEventListener("DOMContentLoaded", function () {
console.log("DOM fully loaded and parsed");
});In this example, the message will be logged to the console as soon as the DOM is ready, allowing you to safely manipulate elements.
