Web Components API In a Nutshell
source link: https://www.tuicool.com/articles/rYvQfma
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
The what and why for the Native Web Components API
Jul 7 ·4min read
We all know that re-using code as much as possible is generally a good idea. Sharing code between components saves us money, energy and most importantly, time.
Re-using code hasn’t been so easy for the complex HTML. You’ve sometimes had to write to render custom UI controls, and how using them multiple times can turn your page into a mess if you are not careful.
Here’s where Web Components come in. Web Components is a suite of different technologies allowing you to create reusable custom elements — with their functionality encapsulated away from the rest of your code — and utilize them in your web apps.
Demo
For example, web components let us define custom elements in HTML files.
Note; We’re not using webpack, rollup or bundler above. The syntax is supported by HTML5 and JavaScript.
Getting Started
All we need is the index.html and the app.js file. Make sure to include the app.js file in your index.html
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK