# data[].attributes.body
Custom Elements
Estado de la especificación: Working Draft W3C
Soporte total en Chrome, Opera y Android Browser > 4.4.4 y Chrome para Android 46

HTML Templates
Estado de la especificación: LS (Living Standard, por la Whatwg)
Soporte total para todos los navegadores menos IE y Opera mini (Edge lo aplicará de manera inminente)

HTML Imports
Estado de la especificación: Working Draft W3C
Soporte total en Chrome, Opera y Android Browser > 44 y Chrome para Android 46

# data[].attributes.body
Permite importar un pedazo de código que podrás usar en un lugar de tu página. Ese código podrá tener HTML, CSS y Javascript. El HTML no se visualizará directamente en la página, pero lo podrías acceder con Javascript e inyectar en algún lugar. Pero aunque se llame específicamente "HTML Imports", realmente sirve para cargar de una manera única tanto HTML como CSS como Javascript. Además podrás tener dentro un "HTML Template", con las ventajas que ellos aportan. Mendiante código Javascript seremos capaces también de registrar componentes personalizados "Custom Elements" o realizar otro tipo de acciones sobre el contenido de la página que sean necesarias.

# data[].attributes.body
Permite importar un pedazo de código que podrás usar en un lugar de tu página. Ese código podrá tener HTML, CSS y Javascript. El HTML no se visualizará directamente en la página, pero lo podrías acceder con Javascript e inyectar en algún lugar. Pero aunque se llame específicamente "HTML Imports", realmente sirve para cargar de una manera única tanto HTML como CSS como Javascript. Además podrás tener dentro un "HTML Template", con las ventajas que ellos aportan. Mendiante código Javascript seremos capaces también de registrar componentes personalizados "Custom Elements" o realizar otro tipo de acciones sobre el contenido de la página que sean necesarias.

# data[].attributes.body
Incorpora un sistema de templating en el navegador. Los templates pueden contener tanto HTML como CSS que inicialmente no se mostrará en la página. El objetivo es que con Javascript se acceda al código que hay dentro del template, se manipule si es necesario y posteriormente se incluya, las veces que haga falta, en otro lugar de la página.

# data[].attributes.body
Esta especificación describe el método que nos permitirá crear nuevas etiquetas personalizadas, propietarias. Estas etiquetas las podremos ingeniar para dar respuesta a cualquier necesidad que podamos tener. Son los casos básicos que hemos visto en los puntos anteriores de este artículo.

# data[].attributes.body
Ahora que ya hemos entendido alguna cosa de lo que son los componentes web, el concepto en sí, vamos a ser un poco más formales y describir las distintas especificaciones que podemos encontrar en los Web Components.

# data[].attributes.body
Ahora que ya hemos entendido alguna cosa de lo que son los componentes web, el concepto en sí, vamos a ser un poco más formales y describir las distintas especificaciones que podemos encontrar en los Web Components.

# data[].attributes.body
Los Web Components nos ofrecen un estándar que va enfocado a la creación de todo tipo de componentes utilizables en una página web, para realizar interfaces de usuario y elementos que nos permitan presentar información (o sea, son tecnologías que se desarrollan en el lado del cliente). Los propios desarrolladores serán los que puedan, en base a las herramientas que incluye Web Components crear esos nuevos elementos y publicarlos para que otras personas también los puedan usar.

En resumen, este nuevo estándar viene a facilitar la creación de nuevos elementos que enriquezcan la web. Pero además, está pensado para que se puedan reutilizar de una manera sencilla y también extender, de modo que seamos capaces de crear unos componentes en base a otros.

# data[].attributes.body
El ejemplo más típico que veremos por ahí es un mapa de Google. Hoy, si no usamos web components, cuando queremos mostrar un mapa en una página web, tenemos que crear código en tres bloques.

1. Un HTML con el elemento donde se va a renderizar el mapa

2. Un CSS para definir algún estilo sobre el mapa, por ejemplo sus dimensiones

3. Lo más importante, un Javascript para que puedas generar el mapa, indicando las coordenadas que deseas visualizar (para centrar la vista inicial) y muchos otros detalles de configuración que tu mapa necesite.

Otro ejemplo sería un calendario, que necesitas de nuevo básicamente tres partes:

1. HTML para crear el elemento donde se mostrará el calendario

2. CSS para indicar las dimensiones de ese calendario, colores, etc.

3. Javascript para decir qué mes, día o año debe mostrar.

# data[].attributes.body
Los componentes web son un conjunto de características que actualmente están siendo añadidas por el W3C a las especificaciones HTML y DOM de forma que permite la creación de widgets o componentes reutilizables en documentos y aplicaciones web.
La intención de estos componentes es traer la ingeniería basada en componentes a la World Wide Web. El modelo de componentes permite la encapsulación e interoperabilidad de elementos de HTML individuales.

# data[].attributes.body
INFORMÁTICA
STEPHANIE CHENG
PROFESORA GUADALUPE ESPINOSA