Да.Веб-компонент является своего рода «виджетом Javascript».
Как правило, вы определяете веб-компонент в файле Javascript.Затем вы можете включить его в любой HTML-код с элементом <script>
.
Пример с минимальным пользовательским элементом с именем <hello-world>
:
In hello-world.js :
customElements.define( 'hello-world', class extends HTMLElement {
constructor() {
super()
this.attachShadow( {mode: 'open' })
.innerHTML = 'Hello World!'
}
} )
На главной странице index.html :
<html>
<head>
<!-- import the web component -->
<script src="hello-world.js">
</head>
<body>
<!-- use the new element -->
<hello-world></hello-world>
</body>
</html>
Примечание: альтернативно можно также скопировать и вставить код Javascript, определяющий пользовательскийэлемент к своей главной странице HTML.