You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
470 B
29 lines
470 B
class Pet extends HTMLElement {
|
|
constructor() {
|
|
super();
|
|
|
|
const shadow = this.attachShadow({ mode: 'closed' });
|
|
|
|
const root = document.createElement('section');
|
|
|
|
const name = this.getAttribute('name')
|
|
|
|
root.innerHTML = `
|
|
<h2>Pet</h2>
|
|
<dl>
|
|
<dt>Name</dt>
|
|
<dd>${name}</dd>
|
|
</dl>
|
|
`;
|
|
|
|
root.querySelector('h2').addEventListener('click', ()=>{
|
|
alert('hi')
|
|
})
|
|
|
|
shadow.appendChild(root)
|
|
}
|
|
}
|
|
|
|
customElements.define('pet-component', Pet);
|
|
|