The goal of this project was to create an e-commerce gallery filter where each section contains products from its respective industry. The tools used were: html5, css3, and javascript (pure). As far as the javascript solution is concerned, I mainly used the DOM (Document Object Model) to perform interactions with html and css, mainly using querySelector()
. Manipulating querySelector()
it was possible to "take" the css style selectors and assign them to interactivity commands with javascript. As can be seen in the code below:
filterContainer.querySelector(".active").classList.remove("active");
In addition, the forEach()
method was used to traverse the array and pass a callback function for each element of the array, along with the current value (item ), and then a conditional if/else
structure is passed.