HTML和HTML5都可以自定義標簽。在瀏覽一些網站的源代碼后，你會發現一些網頁中存在你不認識的標簽和元素，但是這些元素卻能被瀏覽器執行。這就是自定義元素。

自由定義標簽而不必使用預定義好的語義標簽之后，更能語義化我們的內容。

在HTML5之前，文檔的開頭都是這樣標記的。

html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

而HTML5中文檔的標記是這樣的。

這就會導致一些新增的h5元素header、footer，測試過發現IE不能解析h5新增的元素。但是我們給這些元素添加一些樣式，卻能被瀏覽器解析。

組件是 Web 開發的方向，現在的熱點是 JavaScript 組件，但是 HTML 組件未來可能更有希望。

瀏覽器處理

我們一般都使用標準的 HTML 元素。

面代碼中，

就是標準的 HTML 元素。

如果使用非標準的自定義元素，會有什么結果？

Hello?World

上面代碼中，就是非標準元素，瀏覽器不認識它。這段代碼的運行結果是，瀏覽器照常顯示Hello World，這說明瀏覽器并沒有過濾這個元素。

現在，為自定義元素加上樣式。

greeting?{

display: block;

font-size: 36px;

color: red;

}

運行結果如下

接著，使用腳本操作這個元素。

function?customTag(tagName,?fn){

Array

.from(document.getElementsByTagName(tagName))

.forEach(fn);

}

function?greetingHandler(element)?{

element.innerHTML?= '你好，世界';

}`

customTag('greeting',?greetingHandler);

結果如下

這說明，瀏覽器對待自定義元素，就像對待標準元素一樣，只是沒有默認的樣式和行為。這種處理方式是寫入

HTML5 標準的

由上面的測試結果可以得知，自定義標簽可以正常顯示，可以使用css樣式，可以由JavaScript腳本控制

事實上，瀏覽器提供了一個HTMLUnknownElement對象，所有自定義元素都是該對象的實例。

ar?tabs?=?document.createElement('tabs');

tabs instanceof?HTMLUnknownElement //?true

tabs instanceof?HTMLElement //?true

上面代碼中，tabs是一個自定義元素，同時繼承了HTMLUnknownElement和HTMLElement接口。

import HTML

有了自定義元素，就可以寫出語義性非常好的 HTML 代碼。

上面的代碼，一眼就能看出語義。

如果將元素的樣式與腳本，封裝在一個 HTML 文件share-buttons.html之中，這個元素就可以復用了。

使用的時候，先引入share-buttons.html。

然后，就可以在網頁中使用了。

Title

...?...

總結

以上是生活随笔為你收集整理的xml可以html标签吗,自定义html标签(XML)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。