?
本文檔使用 php中文網(wǎng)手冊 發(fā)布
已廢棄
該特性已經(jīng)從 Web 標準中刪除，雖然一些瀏覽器目前仍然支持它，但也許會在未來的某個時間停止支持，請盡量不要使用該特性。
HTML<content> 元素— Web 組件 的技術(shù)套件的廢棄部分 — 用于 Shadow DOM 內(nèi)部作為 insertion point，并且不可用于任何正常的 HTML，現(xiàn)在已被<slot>元素代替，它在 DOM 中創(chuàng)建一個位置，Shadow DOM 會插入這里。
注：雖然在規(guī)范的草案中出現(xiàn)，并且在多個瀏覽器中實現(xiàn)，這個元素依然會在規(guī)范的之后版本中移除。
內(nèi)容類別 | 透明的內(nèi)容。 |
|---|---|
允許的內(nèi)容 | 流量內(nèi)容。 |
標記遺漏 | 沒有，起始和結(jié)束標簽都是強制性的。 |
允許的父元素 | 任何接受流內(nèi)容的元素。 |
DOM界面 | HTMLContentElement |
屬性
這個元素包含 全局屬性。
select逗號分隔的選擇器列表，它們和 CSS 選擇器語法相同。它們選擇要插入的內(nèi)容，來替換為 <content> 元素。
示例
這里是一個使用<content>元素的簡單示例。它是個 HTML 文件，包含所有所需的東西。
注：為了使這個代碼有效，你使用的瀏覽器必須支持 Web 組件，請見 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>如果你在 Web 瀏覽器中展示，它應(yīng)該是這樣。
規(guī)范
這個元素不再被任何規(guī)范定義。
瀏覽器兼容性
Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
Basic Support | 35 | No | 331 | No | 26 | No |
Feature | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
|---|---|---|---|---|---|---|---|
Basic Support | 37 | 37 | No | 331 | No | ? | No |