From the course: Master Next.js: Elaborate Hands-On Web Development, React Basics, Advanced Next.js, and Deployment

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Manipulate the DOM with JavaScript web basics

Manipulate the DOM with JavaScript web basics

What have we done? Well, we have a basic index page, HTML body development. We've got some text in this div that says this is my web application. And we created a script that grabs, that targets this ID. So it's basically targeting everything in this div with JavaScript. Let's actually now create some elements, but not with HTML. Let's do it with JavaScript now that we've actually brought in the script. So recall how we said, besides divs, we could bring in headers with h1s, h2, h3s. And that just creates like a header. If, what do I mean by that? Well, if I were to wrap this is my web application around an h1 tag. So this is a header, oops. All right, so I've got the h1, opens the tag, closes the tag, wraps this element. So now this is my web application should come out as a big header. What do I mean by that? Well, if I go back to Chrome now and we refresh, Notice how we've got this nice, bigger text. This is a default, it's a header tag, all right? Well, so that's cool and all, so…

Contents