Animations

API

Arrays

Async

Basics

Challenges

Classes

Console

Dates

Debugging

DOM Elements

DOM Methods

DOM Navigation

DOM Properties

Event Listeners

Flow Control

Forms

Functions

Global Functions

JSON

Keywords

Libraries (3rd party)

Math

Modules

Objects

Snippets

String

Types

Widgets

Window Object

JavaScript - Query Selector

In addition to using a getElementsById/TagName/Class method, you can use the querySelectorAll method. Like before, you will get a list(array) of all the elements with that match. Using the code below, we will look and see what the contents of paragraphs 1 & 2 are.


This is a very special paragraph.

This is NOT a special paragraph.

This is another special paragraph.

This is a NOT special paragraph.



let specialParagraphs = document.querySelectorAll("p.special");
let results = "";

results = "The first paragraph (index 0) which has the special class is: " + specialParagraphs[0].innerHTML + "<br />";
document.getElementById("demo1").innerHTML = results;