Building Simple components

Now that we understand how to use anonymous functions, let's transform our accordion code to use them: Accordion finished filesaccordion-finished-files.zip2 KBdownload-circle Here is the current code inside the index.js file: //Select the accordion header const accordionHeader = document.querySelector(".accordion .accordion-header"); //Add event listener and

There are two types of functions in Javascript: 1. Custom-defined functions - such as, showModal, hideModal, etc. 2. In-built functions - such as, alert, prompt, print, etc. And within custom-defined functions, there are three types: 1. Named functions 2. Anonymous functions 3. Arrow functions We already know how to define

Inside a particular file, Javascript doesn't care where you declare your custom functions. Let me elaborate. We have worked on creating two components so far: 1. Modal 2. Accordion 1) Modal function showModal(){ let discountModal = document.querySelector("#surprise-discount-modal"); discountModal.style.display = "block"; } let showModalButton

In the last lesson, we set up the foundations for implementing the accordion functionality. And here is the progress we have made so far: But when we click on the Accordion header, nothing happens. We want to open or close the accordion when its header is clicked. To achieve it,

Now that you have a basic understanding of event listeners and handlers, it becomes easy for you to start coding components in Javascript really fast. As proof, we will code functionality for the Accordion component really fast. This project will span several lessons. Along with cementing your understanding of the

If not already, I want you to realize a very important characteristic of event listeners in Javascript. And that is, once we attach an event listener to a particular HTML element, we can keep listening to events generated on that particular element. Repeatedly. 💡Of course, if we want to, we