Chapter 7: The Javascript Document Object Model

7.3 Using Brackets

Now that we are familiar with selecting elements in our document, we are ready to explore some of the properties and methods that Javascript provides to help us modify DOM elements.

If you use Brackets, you may notice that it has a very useful feature. Whenever you select a DOM element and type a period (.) after the element, you’ll see a dropdown list of most of the properties and methods applicable for that element. For instance, try typing

document.querySelector("#first").

into chap7.js and wait for the dropdown list to appear.

Now, use your keyboard arrow keys to scroll through the options that appear. If you see a green circle with the letter “i”, you can mouse over the circle for more information about that option. You can also click on the circle to launch a webpage that provides you with more information and examples.

The video below shows an example:

Pretty cool right? With this feature, you can easily explore the different properties and methods that you can use with a certain element.

In the next two chapters, we’ll discuss some of these methods and properties.