深入理解WebComponents：从概念到实现
本文全面解析WebComponents这一W3C规范，旨在为开发者提供创建自定义HTML元素、扩展现有HTML标签及实现组件封装的技术指南，通过HTMLTemplates、ShadowDOM、CustomElements和HTMLImports四大组成部分，阐述如何在项目中应用WebComponents，解决样式冲突和脚本作用域问题，实现全周期管理。
Web Components 概述
Web Components是W3C目前正在制定的一系列前沿规范，其目的是希望基于HTML、CSS与JavaScript的开发能够实现以下的目标：
1、开发者可以根据业务需求，综合使用HTML、CSS和JavaScript来创建自定义的HTML元素、扩展原有（原生）的HTML，构建自己的组件（widgets）；
2、解决样式、脚本的作用域（影响范围）问题，让CSS样式能够限定在某个范围中、防止冲突；
3、提供对自定义标签的全周期管理。
Web Components主要由四个组成构成：
1 HTML Templates（模板）——它相当于脚手架（Scaffolding），作用是提供可复用的DOM块，作为脚手架；
2 Shadow DOM——封装（Encapsulation），作用是提供DOM、样式、脚本的封装
3 Custom Elements（自定义元素）——扩展（Extensions），扩展HTML已有的标签元素
4 HTML Imports（导入）——将（扩展后）的自定义标签（组件）导入当前主文档中使用
扫一扫
648
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
