From the course: JavaScript: Enhancing the DOM
Unlock the full course today
Join today to access over 22,400 courses taught by industry experts or purchase this course individually.
Querying CSS to select elements
From the course: JavaScript: Enhancing the DOM
Querying CSS to select elements
Selecting elements can be a little bit of a pain with JavaScript. You can select things by ID, tag name, and on newer browsers, by class name. If you're familiar with CSS, one of the best ways of isolating elements is by using a newer function called querySelector. querySelector and its cousin, querySelectorAll let's you choose elements by using CSS-like notation. This let's you pick nodes through CSS selectors. That's super similar to the way that jQuery works. So, if you're familiar selecting things with jQuery, you'll be right at home with this. Now, this is not compatible with older browsers. But it does have a little bit better support than get elements by class name. Notice that it's supported by IE8. This is super easy to use, and probably the best way to select elements in HTML. So, I'm going to go to this HTML document and pull up the developer tools. So, I'm hitting Cmd+Option+I, that's Ctrl+Alt+I on a PC, then hitting the Esc key to pull up the console. Now, here, I'm going…
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
-
-
-
-
Selecting elements with getElementById4m 10s
-
Choosing elements by HTML tag3m 20s
-
Isolating elements by class name3m 12s
-
Querying CSS to select elements4m 54s
-
Working with named form elements3m 39s
-
Understanding nodeType, nodeName, and nodeValue4m 30s
-
Traversing up and down DOM nodes4m 40s
-
Targeting node elements2m 44s
-
-
-
-
-