Lab 38 Reflection

    This lab demonstrates how events work in JavaScript and how you can get the information of what is clicked on a page, demonstrated by a div with 3 layers and a button. In order to get the data, you would have to open the console and click on either of the rectangles or the button to get a response. (The colors in the screenshot might have been changed on the actual website). To make this selection function nicely became very simple. I created three divs in my HTML document and then created a CSS for each one and gave them their personal color. The same applies to the one-button I created. To make the console logs, I used JavaScript to pick out the divs and while you click a div, it'll console. Log the call of that div in phrases of class. For example, the largest field is "one", the second largest is "two" and the smallest div is named "three". The event listener checks for when you click on any of the divs. When it does stumble on you clicked on, it'll show in console with the only you clicked. However, if you click the smallest div, it'll file all three because it contains them all. When you click on the 2d div, it's going to report the first and 2nd div as being clicked. Clicking the largest field will most effectively document the "one" div being clicked. Lastly, the button is on its personal and will say in the console once it's miles clicked. Web designers can experiment with occasion listeners to make their website more interactive. For example, while you click on a button, in place of simply displaying something in console, you can make something else happen, like text pop-up, an animation taking place, etc.