PDFPageElement: of property

Works in all major browsers
Since July 2026

WebPDF works in Chrome and Edge 125, Firefox 153 and Safari 18, on desktop and mobile, and in every later version: the oldest versions its PDF.js build supports, which already have every platform feature WebPDF needs. Since July 2026, that is every major browser.

The of property of the PDFPageElement interface sets or returns the id of the <pdf-file> element whose pages the <pdf-page> shows. It reflects the of HTML attribute.

Value

A string: the id of a <pdf-file> element, or the empty string (the default).

The id is looked up in the page's own root: the document, or the shadow root the page is in. Without of, a page shows the file of its closest <pdf-file> ancestor, so these two pages show the same file:

html
<pdf-file id=f src=//pdf.ist/web.pdf></pdf-file>
<pdf-page of=f></pdf-page>

<pdf-file src=//pdf.ist/web.pdf>
  <pdf-page></pdf-page>
</pdf-file>

When neither finds a file, the page fires an error event with a ReferenceError.

Examples

Switching a page to another file

Setting of makes the page show the same page number of another file.

HTML

html
<pdf-file id=web src=//pdf.ist/web.pdf></pdf-file>
<pdf-file id=forms src=//new.webpdf.pro/forms.pdf></pdf-file>
<button type=button>Show the other file</button>
<pdf-page of=web id=page scale=0.4></pdf-page>

CSS

css
button { display: block; margin-bottom: 1rem; }

JavaScript

js
const page = document.querySelector("#page");
document.querySelector("button").addEventListener("click", () => {
  page.of = page.of === "web" ? "forms" : "web";
});

Result

Specifications

Not part of any specification. <pdf-file> and <pdf-page> are autonomous custom elements defined by WebPDF.pro.

Browser compatibility

How these versions are derived • Report problems with this compatibility data
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
of
1251251531111812515383182712518
Full support

See also