周末无意中了解了Web Component的概念。

http://blog.amowu.com/2013/06/web-components.html

http://www.v2ex.com/t/69389

http://www.infoq.com/cn/news/2013/06/webcomponents

Shadow DOM

http://www.toobug.net/article/what_is_shadow_dom.html

http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/

https://plus.google.com/103330502635338602217/posts?partnerid=gplp0

Youtube上的WebComponent入门视频及PPT

https://www.youtube.com/watch?v=fqULJBBEVQE

http://www.webcomponentsshift.com

Chrome对Element的支持进展2013-07-10

https://www.youtube.com/watch?v=yo2SA3D_KPA

在2013 google IO上对polymer的演示

https://www.youtube.com/watch?v=0g0oOOT86NY

非常好的Shadow DOM演示

https://www.youtube.com/watch?v=JNjnv-Gcpnw

感觉这个东西在浏览器普遍支持之后会收到很多追捧,甚至改变目前web页面的开发方式。有必要认真了解。

目前chrome已经支持很多WebComponent的特性了

Web Component 文章的更多相关文章

  1. Salesforce知识整理(一)之Lightning Web Component Tools

    目录 LWC知识整理(一) 工具 Salesforce CLI Visual Studio Code(VS Code) Developer Hub(Dev Hub) 开启Dev Hub 相关资料 茶余 ...

  2. 使用纯粹的JS构建 Web Component

    原文链接:https://ayushgp.github.io/htm...译者:阿里云 - 也树 Web Component 出现有一阵子了. Google 费了很大力气去推动它更广泛的应用,但是除 ...

  3. how to create one single-file Web Component just using the HTML, CSS, JavaScript

    how to create one single-file Web Component just using the HTML, CSS, JavaScript web components html ...

  4. 示例可重用的web component方式组织angular应用模块

    在online web应用中,经常有这样的需求,能够让用户通过浏览器来输入代码,同时能够根据不同的代码来做语法高亮.大家已知有很多相应的javascript库来实现语法高亮的功能,比如codemirr ...

  5. Web Component总结

    Web Component 一个Web组件通常由四个部分组成:模板.Shadow DOM.自定义元素与打包,其中Shadow DOM解决了组件在页面中的封装问题 Shadow DOM 有shadow ...

  6. Web Component

    前言 Web Component不是新东西,几年前的技术,但是受限于浏览器兼容性,一直没有大规模应用在项目里,直到现在(2018年年末),除IE仍不支持之外,其它主流浏览器都支持Web Compone ...

  7. Web Component探索

    概述 各种网站往往需要一些相同的模块,比如日历.调色板等等,这种模块就被称为“组件”(component).Web Component就是网页组件式开发的技术规范. 采用组件进行网站开发,有很多优点. ...

  8. angular custom Element 自定义web component

    angular 自定义web组件: 首先创建一个名为myCustom的组件. 引入app.module: ... import {customComponent} from ' ./myCustom. ...

  9. amazeui学习笔记二(进阶开发2)--Web组件简介Web Component

    amazeui学习笔记二(进阶开发2)--Web组件简介Web Component 一.总结 1.amaze ui:amaze ui是一个web 组件, 由模板(hbs).样式(LESS).交互(JS ...

随机推荐

  1. 【转】代码编辑器(一)-TSynCompletionProposal用法

    注意,本系列均转载自http://blog.163.com/zom1995@126/ 网上有人给我一个SynEdit这个东西,因为我很喜欢自己编个代码编辑器,但要是用Delphi直接弄的,就我现在这样 ...

  2. python网络画图——networkX

    networkX tutorial 绘制基本网络图 用matplotlib绘制网络图 基本流程: 1. 导入networkx,matplotlib包 2. 建立网络 3. 绘制网络 nx.draw() ...

  3. Oracle 直方图理论

    一.何为直方图 直方图是一种几何形图表,它是根据从生产过程中收集来的质量数据分布情况,画成以组距为底边.以频数为高度的一系列连接起来的直方型矩形图,如图所示 二.ORACLE 直方图 在Oracle中 ...

  4. void *p 类型,illegal indirection错误

    #include<stdio.h>int main(void) {    int i=0;    int *pint=&i;     double d=1.23;    doubl ...

  5. ruby 笔记

    symbol 不能有- 'data-turbolinks-track' => true stop rails –s kill -INT $(cat tmp/pids/server.pid) cl ...

  6. 【设计模式】策略模式 (Strategy Pattern)

    策略模式是一种很简单的基础模式,用于封装一系列算法,使客户端的访问独立于算法的实现.我们可以”井中取水”来形象的描述策略模式.“取水”是一个动作,完成这个动作的方式有很多中,可以直接用手提.可以用水车 ...

  7. kettle删除资源库中的转换或者作业

    在资源库中新建转换,作业都很简单,那么加入现在不需要其中某个转换或者作业该怎么办呢? 下图是已经存在的转换跟作业 现在需要删除aa这个转换 操作步骤如下: 1.工具----资源库----探索资源库 出 ...

  8. 应聘复习基础笔记1:网络编程之TCP与UDP的优缺点,TCP三次握手、四次挥手、传输窗口控制、存在问题

    重要性:必考 一.TCP与UDP的优缺点 ①TCP---传输控制协议,提供的是面向连接.可靠的字节流服务.当客户和服务器彼此交换数据前,必须先在双方之间建立一个TCP连接,之后才能传输数据.TCP提供 ...

  9. iOS七大手势之(平移、捏合、轻扫、屏幕边缘轻扫)手势识别器方法

    使用手势很简单,分为两步: 创建手势实例.当创建手势时,指定一个回调方法,当手势开始,改变.或结束时,回调方法被调用. 添加到需要识别的View中.每个手势只对应一个View,当屏幕触摸在View的边 ...

  10. 【热门收藏】iOS开发人员必看的精品资料(100个)——下载目录

    iPhone.iPad产品风靡全球,巨大的用户群刺激着iOS软件开发需求,然而国内人才缺口很大,正处于供不应求的状态,ios开发前景大好.我们整理了51CTO下载中心100份热门的ios开发资料,做了 ...