20 lines
603 B
JavaScript
20 lines
603 B
JavaScript
class HelloWorld extends HTMLElement {
|
|
static observedAttributes = ["name"];
|
|
|
|
connectedCallback() {
|
|
console.log(`Greeting for ${this.name} initialized`);
|
|
let count = 0;
|
|
this.onclick = () => {
|
|
console.log("Clicked!");
|
|
this.setAttribute("name", `Clicked ${++count}x`);
|
|
};
|
|
this.setAttribute("title", "Click me please");
|
|
}
|
|
|
|
attributeChangedCallback(property, previousValue, currentValue) {
|
|
if (previousValue !== currentValue) {
|
|
this[property] = currentValue;
|
|
this.innerHTML = `<button style="cursor:pointer">Hello ${this.name}!</button>`;
|
|
}
|
|
}
|
|
}
|