1 - Handle Click Events with JavaScript onclick - JSON APIs and AJAX - freeCodeCamp Tutorial

We can add click and document loaded event listeners to only run code when certain conditions have been met. We specify the event as the first argument, and a callback function to run as the second argument.

Link to Challenge : https://www.freecodecamp.org/learn/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property

Full Playlist for this course : https://www.youtube.com/playlist?list=PLhGp6N0DI_1RxEqV5H-ScZE4DWEIZUh5f All Writen Guides for this course : https://www.notion.so/ganeshh123/11cab36e8f814f34afcc0aaa2c91a644 All My Tutorials can be found at : https://www.notion.so/Tutorials-Ganesh-H-293ea420d34a464f9a1907e0405b5f26

Concepts: addEventListener() The EventTarget method addEventListener() sets up a function that will be called whenever the specified event is delivered to the target. Common targets are Element, Document, and Window, but the target may be any object that supports events (such as XMLHttpRequest). addEventListener() works by adding a function or an object that implements EventListener to the list of event listeners for the specified event type on the EventTarget on which it's called. https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

DOMContentLoaded The DOMContentLoaded event fires when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading. https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event

onclick The onclick property of the GlobalEventHandlers mixin is the EventHandler for processing click events on a given element.The click event is raised when the user clicks on an element. It fires after the mousedown and mouseup events, in that order. https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onclick -————————————————————————————————————- JSON (JavaScript Object Notation) is an open standard file format, and data interchange format, that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and array data types.

Ajax is a set of web development techniques using many web technologies on the client side to create asynchronous web applications. With Ajax, web applications can send and retrieve data from a server asynchronously without interfering with the display and behavior of the existing page.

freeCodeCamp (also referred to as “Free Code Camp”) is a non-profit organization that consists of an interactive learning web platform, an online community forum, chat rooms, online publications and local organizations that intend to make learning web development accessible to anyone. Beginning with tutorials that in ... https://www.youtube.com/watch?v=EvQXlUTsfPw