2022.1

Table Of Contents
// Update the page numbers
var $numbers = query('.number');
merge.context.query("h1, h2").each(function( index ) {
var pageNo = this.info().pageNo;
var entry = $numbers.get( index );
if( entry ) {
entry.text( pageNo );
}
});
What the script does
First the script creates a variable to hold the table of contents: toc.
Then it collects all <h1> and <h2> elements - in other words, level 1 and 2 headings. The
merge.context.query(selector) function searches across all Print sections (see "query
(selector)" on page1507).
The query returns a result set. Each of the elements in the result set goes through the callback
function defined in each() (see "each()" on page1345).
The callback function gets the element's page number, text and HTMLtag name:
var pageNo = this.info().pageNo;
var text = this.text();
var level = this.tagName();
Note that the info() function can also be used to get an element's sheet number, the section it is
located in, and the total page count and sheet count of that section (see "PaginationInfo" on
page1508 and "info()" on page1513). In this case only the page number is used.
Then the callback function adds an entry to the variable that holds the table of contents, using
the retrieved info.
toc += '<p class="toc-entry ' + level + '">';
toc += '<span class="text">' + text + '</span>';
toc += '<span class="dots"></span>';
toc += '<span class="number">' + pageNo + '</span></p>';
The HTML tag name is added as a class. This can be used in a CSS file to style the entries in
the table of contents according to their level. (See "Step 4: Styling the table of contents" on
page976.)
The empty span between the heading's text and page number has the class dots. This is used
Page 974