I need to suppress multiple page numbers that appear on the same index entry inside of a PDF. I am using JavaScript that will run after the HTML/CSS template is generated and looks for a "parent" attribute that is inside specific headers in the PDF. It creates an array that will generate the index template using those parent tags as reference tags for the index entry to point to the header with an an href tag

<div class="tLeft font12 hIndent1"><span class="tLeft font12 hIndent1"><a href="#index_141" class="prodlink font12 tLeft">Academic Programs and Standards</a></span></div>

. inside the div class it uses "prodlink" that points to my CSS stylesheet that will create the page number and the index number ( example: "A-1, B-2"). the CSS code is
.prodlink {
color: black !important;
Font-Weight: normal;
Text-Decoration: none;
line-height: 150%;
}
.prodlink:after {
content: ", " target-counter(attr(href, url), sectionletter, upper-alpha) "-" target-counter(attr(href, url), page);
}

this creates the page and section number. Once all that is done it send it to the the index template to generate the new template and PDF. The issue is that sometimes the same header will appear on multiple pages and therefor creates duplicate page numbers for the index entry. i need to suppress all duplicate page numbers for each index entry.

When creating the array, could you check which pages the headers occur on and skip duplicates?

The biggest issue I have had with this is that i have not been able to find a way to find the page number using javascript. What would be a good way to find this?

Edited 9 Mar 2023 by isaacwalth

Are you using the JavaScript box tracking API? The boxes have a pageNum property.

Several examples in this guide uses the pageNum property:
https://css4.pub/2023/boxtracking/