Desaprobado
This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.
El elemento HTML <content> es usado dentro de un Shadow DOM como un insertion point . No está pensado para ser usado en HTML ordinario . Es usado con Web Components.
Nota: Aunque está presente en un draft inicial de las especificaciones e implementado en varios exploradores , este elemento ha sido removido en versiones posteriores a la especificación .
| Categorías de contenido | Modelo de contenido transpatente |
|---|---|
| Contenido permitido | Contenido dinámico |
| Omisión de etiquetas | None, both the starting and ending tag are mandatory. |
| Elementos padre permitidos | Any element that accepts flow content. |
| Interfase DOM | HTMLContentElement |
Atributos
Este elemento incluye los atributos globales .
- select
- Una lista de selectores separada por comas . Estos tienen la misma sintaxis que los selectores de CSS . Seleccionan el contenido a insertar en lugar del elemento <content> .
Ejemplo
Aquí hay un ejemplo simple del uso del elemento <content> . Es un archivo HTML con todo lo necesario en el .
Nota: Para que este código funcione , el explorador en el que se muestre debe de soportar Web Components . Ver Enabling Web Components in Firefox .
<html>
<head></head>
<body>
<!-- The original content accessed by <content> -->
<div>
<h4>My Content Heading</h4>
<p>My content text</p>
</div>
<script>
// Get the <div> above.
var myContent = document.querySelector('div');
// Create a shadow DOM on the <div>
var shadowroot = myContent.createShadowRoot();
// Insert into the shadow DOM a new heading and
// part of the original content: the <p> tag.
shadowroot.innerHTML =
'<h2>Inserted Heading</h2> <content select="p"></content>';
</script>
</body>
</html>
Si muestras esto en un explorador web , debe de verse como lo siguiente .
Especificaciones
| Especificación | Estatus | Comentario |
|---|---|---|
| Shadow DOM The definition of 'content' in that specification. |
Working Draft |
Compatibilidad con exploradores
| Caracterísitica | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Soporte básico | 35 | 28 (28) [1] | No support | 26 | No support |
| Catacterística | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Soporte básico | 37 | 28.0 (28) [1] | No support | ? | ? |
[1] Si el Shadow DOM no está habilidado en Firefox , los elementos de <content> se comportarán como HTMLUnknownElement . Shadow DOM fue implementado por primera vez en Firefox33 y está detras de una preferencia , dom.webcomponents.enabled, el cual está deshabilitado por default .