Visual Home Home

Controlling DOM with JS

What if I want to change the page elements with a click of button. Like there are two versions of the that is superimposed. This page can have all the headings colored green and para with blue in one version. In other version the headings are purple and the para are orange.

Power of Selectors

There are many directions in which the code execution can be directed. Finally the state of something needs to be changed. That is the evidence that code as acted upon and the behaviour has changed.

P5 recognises the CSS style selectors and attributes. This page has 3 states, where no color is applied. Two other states the color of the elements dynamically changes between two states.

Existing Classes Interfere

Heading of the page change color with the buttons. The para elements are stubborn. Because of the classes that is already hard coded in creating this page. The P5 code is not having the ability to remove those classes out of the page.

Super Powered Button

There is a very interesting idea of attaching callbacks to all the elements that we want.