You can read Part 2 here:
We will be using a project Stick-It Notes to learn the DOM commands in this course. We will also be learning how to build this website step by step after a while in this series.
The same class can be used more than once for several elements, but a unique ID can be used only for one element. So when we are grabbing an element using ID, we will get only one element in return.
<p id="ts">The para to pick</p>
let paragraphElement = document.getElementById('ts')
You can get to know the values or the content in the element [ coming up in the next article... ]
You can style the element
let paragraphElement = document.getElementById('ts'); paragraphElement.style.color = 'yellow';
You can change the color, the font size, background color, pretty much any CSS Style that you would apply normally. Note: we don't use hyphens here '-' as a separator between styles like background-color, font-size, font-family, etc., Instead, you've to remove the hyphen and capitalize the first word after it.
let paragraphElement = document.getElementById('ts'); paragraphElement.style.backgroundColor= 'red'; paragraphElement.style.fontSize= '0.9rem';
You can access and do a lot more magic by grabbing the elements. We will explore and do stuff in this series. All you have to know now is that there is getElementById grabs only one element. And once you get that element, store it in a variable and use it for the purpose.
Next Part, where we discuss about what TextContent, innerText and innerHTML are and the differences between them.
Thank you for reading 😊
Considering Subscribing to my YouTube Channel if you like the Video content: https://youtube.com/c/developerTharun