loading... Pacem JS

DOM Islands

PacemViewElement instances are like DOM "islands" that can be dynamically filled with HTML content.

The routing system exploits the PacemViewElement to mimic page navigation.


PacemViewElement manages both "actual" URLs (by fetching them) and references to local elements (<template>).
The content retrieved gets materialized into the view element itself.

<!-- network content -->
<!-- brings the content in '/static/content.html' into the view element -->
<pacem-view url="/static/content.html"></pacem-view>

<!-- local content -->
<template id="tmpl0">
    <p>Hello, World!</p>
<!-- brings the templated content into the view element -->
<pacem-view url="#tmpl0"></pacem-view>

The following demo shows how to switch among local content, and how the view behaves when it's disabled: