2021.1

Table Of Contents
The first line creates a variable for the table of contents, which will be a list (a <ul> element with
the ID toc). The start tag of the list is added to the variable.
The next line does a query for all level 1 headings (<h1> elements) with the class title in the
current section. With each() the script loops through them. For each of the headings it adds a
line item to the list, with the text (this.text()) and the page reference of the respective
heading.
After the loop, the end tag of the list is added to the variable.
Finally, the script adds the variable - that now contains the table of contents - after the results.
The results object contains the elements that match the selector of the script. So, if the script's
selector selects the title of the table of contents, the table of contents will be added after that.
The following style rules, added to the style sheet, will align the chapter titles to the left and the
page numbers to the right:
#toc li {
text-align:left;
}
#toc span {
float: right;
}
Note that these styles use the list's ID, that was defined in the first line of code. For information
about style sheets, see "Styling templates with CSS files" on page738.
parent()
Returns the parent(s) of one or more HTML elements, which can be:
l The elements that match the selector of a script (see "results" on page1427).
l One element that matches the selector of a script that runs for "Each matched element"
(see "this" on page1345 and "Setting the scope of a script" on page874).
l The elements returned by a query in the template (see "query()" on page1299).
In HTML, a parent is an element that contains another element.
To get an ancestor that matches a particular selector, use closest() (see "closest()" on
page1362).
To get an element's sibling element, you can use "prev()" on page1377 or "next()" on
page1370.
Page 1334