attribute on component

11 months ago · 501254cd4f
parent eb7b786bdd
commit 501254cd4f
2 changed files with 11 additions and 4 deletions
--- a/component.js
+++ b/component.js
@ -1,17 +1,24 @@
-class MyComponent extends HTMLElement {
+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>Hello from MyComponent!</h2>
+			<h2>Pet</h2>
 			<dl>
 				<dt>Name</dt>
 				<dd>${name}</dd>
 			</dl>
 		`;
 		shadow.appendChild(root)
 	}
 }
-customElements.define('my-component', MyComponent);
+customElements.define('pet-component', Pet);
--- a/index.html
+++ b/index.html
@ -6,6 +6,6 @@
 	<script defer src="component.js"></script>
 </head>
 <body>
-	<my-component></my-component>
+	<pet-component name="fido"></pet-component>
 </body>
 </html>