2022.2

Step 2: Creating a placeholder for the TOC
CreateoneextraPrintsectiontoputtheTableOfContentsin.
Insidetheextrasection,insertanArticleelement(see"Insertinganelement"onpage173).
GivetheelementanID,forexample:toc-content.ThiselementistheplaceholderfortheTOC.
Step 3: Inserting the Post Pagination script
InsertaPostPaginationscript(see"AddingaPostPaginationScript"onthepreviouspage).
Double-clickonthenewscripttoopenit.
SetitsselectortotheIDthatyouspecifiedinStep2,precededbya#,forexample:#toc-content.
Pastethefollowingcodeinthescripteditor:
// Build the TOC
var toc = '';
merge.context.query("h1, h2").each(function() {
var pageNo = this.info().pageNo;
var text = this.text();
var level = this.tagName();
toc += '<p class="toc-entry ' + level + '">';
toc += '<span class="text">' + text + '</span>';
toc += '<span class="dots"></span>';
toc += '<span class="number">' + pageNo + '</span></p>';
});
results.html( toc );
// Repaginate the result
merge.section.paginate();
// 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843).
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717).
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();
Page 412