Indice

Deprecato: questa funzione non è più consigliata. Sebbene alcuni browser possano ancora supportarlo, potrebbe essere già stato rimosso dagli standard Web pertinenti, potrebbe essere in fase di eliminazione o potrebbe essere conservato solo per motivi di compatibilità. Evita di usarlo e, se possibile, aggiorna il codice esistente. Tieni presente che questa funzione potrebbe cessare di funzionare in qualsiasi momento.

L' elemento HTML <content>, una parte obsoleta delle tecnologie Web Components , è stato utilizzato all'interno di Shadow DOM come punto di inserimento e non doveva essere utilizzato nel normale HTML. Ora è stato sostituito dall'elemento <slot>, che crea un punto nel DOM in cui è possibile inserire un DOM ombra.

Attributi

select

Un elenco di selettori separati da virgole. Questi hanno la stessa sintassi dei selettori CSS. Selezionano il contenuto da inserire al posto dell'elemento <content>.

Esempio

Ecco un semplice esempio di utilizzo dell'elemento <content>. È un file HTML con tutto il necessario al suo interno.

Nota: affinché questo codice funzioni, il browser in cui lo visualizzi deve supportare i Web Components.

<html>
          <head></head>
          <body>
        
          <!-- il contenuto originare a cui si accede da <content>-- >
        
          <div>
            <h4>Titolo del contenuto</h4>
            <p>Testo del contenuto </p>
          </div>
          
          <script>
          // Seleziona il div di cui sopra
          var myContent = document.querySelector('div');
          // crea una 'shadow DOM' sul <div>
          var shadowroot = myContent.createShadowRoot();
          // Inserisci un titolo e parte del contenuto originale: l'elemento <p>
          shadowroot.innerHTML =
            '<h2>Titolo da inserire</h2> <content select="p"></content>';
          </script>
        
          </body>
</html>