Elena, Unfaithful by https://padlet.com/nicole_i0018_/fu2py2n1peva Interpretation of a story by Gloria Broder en-us 2018-05-18 22:09:18 UTC 2026-01-01 12:24:05 UTC hello@padlet.com ¿Cómo se usan? nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059968 Para poder empezar a usar un Web Component, sólo tenemos que importarlo desde la cabecera o etiqueta head de la página que lo vaya a usar mediante la siguiente etiqueta:

<link rel="import" href="ejemplo-componente.html">]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059968 En qué consisten nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059969 Suponen una revolución en el mundo del desarrollo Web en términos de reutilización y encapsulación de código cliente, ya que permiten encapsular código HTML, CSS y JavaScript, de forma que no puede ser afectado por el código de la página que lo incluye.]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059969 Historia nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059970 Los componentes web fueron introducidos por Alex Russell en la conferencia Fronteers Conference de 2011.
Polymer, una biblioteca basada en componentes web, fue liberada por Google en 2013.

]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059970 Bibliotecas nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059971 Hay varias librerías que están construidas sobre componentes web con el objetivo de aumentar el nivel de abstracción al crear elementos personalizados. Cuatro de las bibliotecas más importantes son: X-Tag, Slim.js, Polymer y Bosonic.
Dos de ellos, Bosonic y Polymer, proporcionan componentes listos para usar. Estos componentes se pueden utilizar indistintamente, ya que todos ellos están construidos con tecnologías web abiertas.

]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059971 Soporte del navegador nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059972 Las plantillas HTML tienen soporte en Google Chrome, Mozilla Firefox, Edge de Microsoft, Safari, y Ópera.11​
La compatibilidad con la versión inicial de elementos personalizados y Shadow DOM, conocida como "v0", está presente en algunos navegadores basados en Blink como Google Chrome y Opera, y en Mozilla Firefox.


]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059972 Plantillas HTML nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059973 La plantilla HTML es una forma de crear fragmentos de inserción de HTML que se usan a voluntad. La sintaxis de las plantillas HTML tiene este aspecto:
<html>
    <template>
        <p>The HTML you wish to instantiate on will</p>
    </template>
</html>
Los scripts no se ejecutarán, y los recursos que están dentro de una plantilla no serán recuperados hasta que la plantilla sea eliminada.
]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059973 Importar HTML nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059974 HTML import es una herramienta para incluir documentos HTML y componentes web de fuentes externas sin necesidad de utilizar peticiones AJAX y métodos similares.
La sintaxis para hacer una importación HTML es la siguiente:
<link rel="import" href="mydocument.html">
]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059974 Shadow DOM nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059975 es una funcionalidad que permite al navegador web renderizar elementos DOM sin necesidad de insertarlos en el árbol principal DOM del documento. Esto crea una barrera entre lo que el desarrollador y el navegador pueden alcanzar; el desarrollador no puede acceder al Shadow DOM de la misma manera que lo haría con los elementos anidados, mientras que el navegador puede renderizar y modificar ese código de la misma manera que lo haría con los elementos anidados. ]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059975 Elementos personalizados nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059976 Hay dos tipos de elementos personalizados: autónomos e integrados. Los elementos personalizados autónomos son elementos HTML completamente diferenciados de los elementos HTML nativos, se construyen esencialmente desde abajo hacia arriba utilizando la API de elementos personalizados. Los elementos personalizados integrados son elementos que se construyen sobre elementos HTML nativos para reutilizar su funcionalidad.]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059976 Principales Características nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059977
  • Elementos personalizados - APIs para definir elementos HTML nuevos.
  • Sombra DOM - DOM y estilos encapsulados, con composición.
  • Importaciones de HTML - Métodos declarativos para importar documentos HTML a otros documentos.
  • Plantillas de HTML - El elemento <template> que permite que los documentos contengan trozos inertes del DOM.

    • ]]>     2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059977     Componentes web nicole_i0018_ https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059978 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.]]> 2018-05-18 22:09:18 UTC https://padlet.com/nicole_i0018_/fu2py2n1peva/wish/262059978