Web Component for Copyright Years
This Web Components keeps the year in your copyright notice up-to-date.
export { CopyrightYearElement } const name = "copyright-year"; class CopyrightYearElement extends HTMLSpanElement { constructor() { super(); } connectedCallback() { const year = new Date().getFullYear(); const shadow = this.attachShadow({ mode: "open" }); const span = document.createElement("span"); span.appendChild(document.createTextNode(`${this.textContent} - ${year}`)); shadow.appendChild(span); } } customElements.define(name, CopyrightYearElement, {extends: 'span'});
Use the module.
<script type="module" src="copyright-year.js"></script>
Use the Web Component with the attribute is
<span>© <span is="copyright-year">2023</span> Web Component Super Hero</span>
or as a dedicated element.
<span>© <copyright-year>2023</copyright-year> Web Component Super Hero</span>