HTML and CSS Reference
Selecting Page Elements
functions to select elements. Here you are going to look at the four main ones. You use what you learn here in
Chapter 11 when building custom playback controls for a video, and in Chapter 12 when you store data entered into
a web form.
Up to now, you haven't made much use the developer tools that you installed at the beginning of the topic. That's go-
Debugging refers to the process of examining your code to find and correct errors (or bugs ) that are causing your
program to behave in a way that it was not intended to.
The following examples use the developer tools supplied with Google Chrome, but feel free to use other tools if you
are more familiar with them.
Before starting, you need to set up a test page from which you can select elements. Create a new file using the fol-
lowing code, or alternatively you can use the example10-9.html , which can be found in the Chapter 10 folder
of the downloadable code resources.
<title>Selectors Test Page</title>
<h1>This is a test page</h1>
<h1>A Text Section</h1>
<p id="firstParagraph" class="paragraph">
This text is within the first paragraph element.
This text is in the second p element.
<h1>A Web Form</h1>
<form id="webForm" action="#" method="post">
<input type="text" id="name" name="name">