ES6 — DOM

Cristiansalerno
Nov 4 · 2 min read

Today i want to show some ways to manipulate the JS DOM without JQuery.

Examples how to manipulate DOM .

For Example, we have an <ul> tag with links . I use id on link 3 to manipulate with getElementById.

getElementById( idName) and with innerText we can change the text inside.

Changed the innerText from ‘Item 3’ to ‘Item 5’

On ES6 we have a lot of options to modify and use the DOM without Jquery. see the below example : I use three diferents way in order to paint <li> tags inside my HTML by a dinamic way:

For Of , For and forEach.

Also it’s possible to modify CSS adding or removing classes , create new elements with AppendChild , etc.

Remember, documentation is there for an important reason, to be read. : )

I’m bit bussy learning Angular, so when i have some mins i write those articles in order to refresh my mind and most important that i say : “don’t lose the basics.”

Keep learning, keep coding!

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade