为了在我的网页中使用自定义实体以及其他可扩展功能，我一直在使用无效的XHTML 1.0 Strict。但是这样做是否存在问题？或者这是编写网页的完全有效的方法（除了无法在不理解XHTML MIME类型的浏览器中显示）？
我很好奇是否可以使用XML技术将Bootstrap Div嵌套到有意义的标记中，而无需使用JavaScript来解析自定义标记。
特别是编写有效的XHTML非常困难，因为许多HTML5标签（如canvas和nav）未被定义为有效元素，并且存在许多奇怪的方式使其无效，尽管这是现代有效的Web实践。这更加成问题，因为这使得不可能使用AngularJS指令创建自定义标记，或使用自定义标记使用javascript进行解析（因为我不知道如何扩展现有的XHTML doctype以使其理解那些标记是有效的）。
示例：
index.php：
<?php header('Content-Type: application/xhtml+xml'); ?>
<!-- Not intended to be validated, but exploit XHTML benefits anyway -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd"
[
<!ENTITY page-title "Daily Bits and Bytes">
]>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>&page-title;</title>
</head>
<body>
</body>
</html>
考虑因素：
我正在考虑完全放弃使用严格的文档类型声明，而是使用自己的文档类型声明，并将网页作为应用程序/xhtml+xml发送。据我了解，现代浏览器甚至不会查看XHTML DTD，并且XHTML并未提供任何默认情况下HTML没有的额外实体/定义，因此似乎对网页没有任何价值，而自定义实体则有。例如：
<?php header('Content-Type: application/xhtml+xml'); ?>
<!DOCTYPE my-dtd
[
<!ENTITY page-title "Daily Bits and Bytes">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>&page-title;</title>
</head>
<body>
</body>
</html>
另一个好处
例如，为 p 标签创建自定义颜色属性：
index.xhtml：
<?xml-stylesheet type="application/xml" href="style.xsl"?>
<!DOCTYPE my-dtd
[
<!ENTITY page-title "Daily Bits and Bytes">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>&page-title;</title>
</head>
<body>
<p color="blue">This paragraph is blue</p>
<p>hello</p>
</body>
</html>
style.xsl:
<xsl:stylesheet xmlns="http://www.w3.org/1999/xhtml"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()" />
</xsl:copy>
</xsl:template>
<xsl:template match="xhtml:p[@color]">
<xsl:element name="xhtml:p">
<xsl:attribute name="style">
color:
<xsl:value-of select="./@color" />
;
</xsl:attribute>
<xsl:apply-templates select="@*|node()" />
</xsl:element>
</xsl:template>
</xsl:stylesheet>
另一个好处
自定义域名特定元素，例如导航栏，
转换
<navigation-bar>
<link to="someplace">text</link>
</navigation-bar>
为了
<nav class="navbar navbar-inverse">
<ul class="nav navbar-nav>
<li><a href="someplace">text</a></li>
</ul>
</nav>
没有使用JavaScript（仍然会使页面加载变慢，但是一旦生产完成，您可以通过仅提供转换结果来优化XSL，这比翻译基于jQuery / JavaScript的转换更容易）。
index.xhtml：
<?xml-stylesheet type="application/xml" href="style.xsl"?>
<!DOCTYPE my-dtd
[
<!ENTITY page-title "Daily Bits and Bytes">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>&page-title;</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
</head>
<body>
<navigation-bar>
<link to="https://stackoverflow.com">StackOverflow</link>
<link to="https://facebook.com">Facebook</link>
<link to="https://twitter.com">Twitter</link>
</navigation-bar>
<p color="blue">I am red</p>
<p>hello</p>
</body>
</html>
style.xsl:
<xsl:stylesheet xmlns="http://www.w3.org/1999/xhtml"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<xsl:template match="@*|node()">
<xsl:copy>
<xsl:apply-templates select="@*|node()" />
</xsl:copy>
</xsl:template>
<xsl:template match="xhtml:p[@color]">
<xsl:element name="xhtml:p">
<xsl:attribute name="style">
color:
<xsl:value-of select="./@color" />
;
</xsl:attribute>
<xsl:apply-templates select="@*|node()" />
</xsl:element>
</xsl:template>
<xsl:template match="xhtml:navigation-bar">
<xsl:element name="nav">
<xsl:attribute name="class">navbar navbar-inverse</xsl:attribute>
<xsl:element name="ul">
<xsl:attribute name="class">nav navbar-nav</xsl:attribute>
<xsl:for-each select="current()/xhtml:link">
<li>
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@to" />
</xsl:attribute>
<xsl:value-of select="text()" />
</xsl:element>
</li>
</xsl:for-each>
</xsl:element>
</xsl:element>
</xsl:template>
</xsl:stylesheet>