From the course: JavaScript Essential Training
Unlock the full course today
Join today to access over 24,000 courses taught by industry experts.
Access elements with querySelector methods - JavaScript Tutorial
From the course: JavaScript Essential Training
Access elements with querySelector methods
- [Instructor] Let's take a look at how to access elements in the DOM using JavaScript. In the exercise files for this movie, I've updated our examples so we have some actual content to work with. I've added some basic HTML and a style sheet in index.html and I've also expanded the HTML output in the template literal a little bit to make it possible to style it. I've added some classes. I've wrapped spans around the values, and I've also added an image at the top here. Looking at the project site in the browser you'll see, it looks quite different but there's nothing new here in terms of JavaScript. I've just expanded on what we've covered so far in the course. All right, anytime you want to do something in the DOM you start by finding the element or elements you want to work with. For this, we have two methods: query selector and query selector all. And they both apply to the document object. These methods use…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
DOM: The Document Object Model4m 7s
-
(Locked)
Access elements with querySelector methods6m 6s
-
(Locked)
Access elements using older methods3m 45s
-
(Locked)
Practice: Find an element1m 29s
-
(Locked)
Modifying element classes4m 53s
-
(Locked)
Attributes4m 13s
-
(Locked)
Inline style3m 52s
-
(Locked)
Practice: Modify classes and attributes, and styles1m 36s
-
(Locked)
Add DOM elements5m 25s
-
(Locked)
Challenge intro: Create elements1m 17s
-
(Locked)
Solution: Create elements3m 35s
-
-
-
-
-
-
-