From the course: JavaScript: Enhancing the DOM
Join today to access over 24,700 courses taught by industry experts.
Web components and custom elements
From the course: JavaScript: Enhancing the DOM
Web components and custom elements
- [Instructor] As a developer, you probably have a not so secret love for code reuse and a dry principle, "Don't repeat yourself." At this point, you might not be sure how to achieve that with HTML on JavaScript. Whenever you need a part of your page multiple times or at different pages, you might need to have duplicate code. Well, that's where web components come in. They bring a whole new level of creativity and reusability to web development. A web component consists of three parts, custom elements, a shadow DOM, and HTML templates. Custom elements allow you to define your own HTML text, pretty much. They're like creating your brand of bricks in the fast construction set of the web. You create a custom element by defining a class that extends HML element, and then register it using custom elements.define. For example, if you want to create a user profile element, you define and register it, and then after that, you can use it in your HTML like any other tag. The shadow DOM provides…
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.