21 lines
545 B
JavaScript
21 lines
545 B
JavaScript
class HelloWorld extends HTMLElement {
|
|
static get observedAttributes() {
|
|
return ["data-name"];
|
|
}
|
|
|
|
connectedCallback() {
|
|
let count = 0;
|
|
|
|
if (!('name' in this.dataset)) {
|
|
this.dataset.name = 'World';
|
|
}
|
|
|
|
this.onclick = () => this.dataset.name = `Clicked ${++count}x`;
|
|
}
|
|
|
|
attributeChangedCallback(property, previousValue, currentValue) {
|
|
if (property === "data-name" && previousValue !== currentValue) {
|
|
this.innerHTML = `<button style="cursor:pointer">Hello ${currentValue}!</button>`;
|
|
}
|
|
}
|
|
}
|