我应该使用 在 HTML5 中？
我很确定 部分可以在 XHTML5 中使用，但是 HTML5 呢？
I'm pretty sure <![CDATA[...]]> sections can be used in XHTML5, but what about HTML5?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
CDATA结构实际上根本不是用于 HTML，而是用于 XML。人们有时在 XHTML 的
script标记内使用它们，因为这样就不需要它们转义<、>和& 了。字符。但在 HTML 中这是不必要的，因为 HTML 中的script标记已经像 CDATA 部分一样被解析。编辑：在这里，我们打开了 2002 年以来发霉的旧蠕虫罐，无论您是将 XHTML 作为
text/html还是作为application/xhtml+ 发送xml就像你“应该”那样:-)The
CDATAstructure isn't really for HTML at all, it's for XML.People sometimes use them in XHTML inside
scripttags because it removes the need for them to escape<,>and&characters. It's unnecessary in HTML though, sincescripttags in HTML are already parsed like CDATA sections.Edit: This is where we open that really mouldy old can of worms from 2002 over whether you're sending XHTML as
text/htmlor asapplication/xhtml+xmllike you’re “supposed” to :-)在同一页面@pst 链接到：
最大向后兼容性：
更简单的版本，与“更旧的浏览器”有点不兼容：
因此，
CDATA可以在HTML5中使用，并且在官方XHTML-HTML兼容性指南。这对于多语言 HTML/XML/XHTML 页面很有用，在开发过程中充当严格的
application/xmlXML，但在生产模式中充当text/htmlHTML5，以获得更好的跨浏览器兼容性。 多语言页面有其优点；我自己就用过这个，因为它更容易调试 XML/XHTML5。例如，Google Chrome 会因无效的 XML/XHTML5 抛出错误（包括例如 字符转义），而作为 HTML5 的同一页面将“正常工作”也称为“可能工作”。From the same page @pst linked to:
Maximum backwards compatibility:
Simpler version, sort of incompatible with "much older browsers":
So,
CDATAcan be used in HTML5, and it's recommended in the official Guidance for XHTML-HTML compatibility.This useful for polyglot HTML/XML/XHTML pages, which are served as strict
application/xmlXML during development, but served astext/htmlHTML5 in production mode for better cross-browser compatibility. Polyglot pages have their benefits; I've used this myself, as it's much easier to debug XML/XHTML5. Google Chrome, for example, will throw an error for invalid XML/XHTML5 (including for example character escaping), whereas the same page served as HTML5 will "just work" also known as "probably work".该规范似乎解决了这个问题。 script 和 style 标签被视为“原始文本元素”。它们不需要或不允许使用 CDATA。 CDATA 仅与“外来内容”一起使用 - 即 MathML 和 SVG。请注意，脚本标记中可以包含的内容有一些限制 - 基本上您不能在其中放置类似
var x = ''的内容，因为它会关闭标记并且需要像他的回答中指出的那样进行拆分。 http://www.w3.org/TR/html5/syntax .html#cdata-rcdata-限制The spec seems to clear up this issue. script and style tags are considered to be "raw text elements." CDATA is not needed or allowed for them. CDATA is only used with "foreign content" - i.e. MathML and SVG. Note that there are some restrictions to what can go in the script tag -- basically you can't put something like
var x = '</script>'in there because it will close the tag and needs to be split like pst noted in his answer. http://www.w3.org/TR/html5/syntax.html#cdata-rcdata-restrictions支持 HTML5 的浏览器（以及大多数可追溯到 2001 年的较旧浏览器）已将
但是...如果您希望 HTML5 页面兼容，您确实需要在
注意：CDATA 标记 帮助 XML 解析器忽略可能在这些元素之间弹出的特殊字符，这些元素是 XML 元素的一部分，因此会破坏标记（例如使用
< 或>字符）。只有现代 HTML 解析中的XML 和 XHTML 解析器将像处理所有 HTML 元素一样读取
问题是，大多数 HTML4/HTML5 浏览器和解析器不支持在这些标记之间添加额外的 CDATA 部分，因此如果您添加它们以支持 XHTML/XML，则必须为这些代理注释掉 CDATA 块。
另请注意，在这些标记内添加的所有 HTML 注释（
）都会被 HTML 解析器忽略，但由 XHTML 解析器实现，注释添加 XHTML 的 CSS 和 JavaScript 后。过去，许多人会在这些标签之间添加注释规则，以隐藏通常无法理解 CSS 或 Javascript（1998 年之前的浏览器）的非常旧的浏览器的样式和脚本。但在没有额外代码的情况下，该策略在 XHTML 中失败了。那么，如何组合
我是一个纯粹主义者，希望我的 HTML5 内容仍然XML/XHTML 友好，无论我使用什么标记建议。我还希望我的页面能够在支持 CSS 的浏览器和不支持 CSS 的旧浏览器中运行。因此，这里有两种解决方案可以支持所有这些场景，并且仍然可以在现代浏览器中显示样式和脚本而不会出现错误。 它们在现代 HTML5 浏览器中使用是完全安全的：
样式
脚本
附加注释
这两个代码块不会改变现代 HTML5 浏览器中的任何内容。
这两个代码块将允许您的 CSS 和 JavaScript 像以前一样在 HTML5 浏览器中正常工作，但会对不支持这些技术的非常旧的浏览器（2001 年之前）隐藏 CSS 和 JavaScript。
XHTML 浏览器现在将像以前一样解析您的 CSS 和 JavaScript，但不允许使用特殊字符，例如
<、>和&被解释为标记或实体/转义字符，这会产生解析错误。他们现在是 CDATA。当然，页面的 XML 解析器不会理解您的 CSS 和 JavaScript，但会接受您在其中添加的任何类型的文本，而不是尝试将它们解析为标记。他们现在是 CDATA。
示例如何工作
对于支持 HTML5 的现代浏览器，由于
script和style元素的行为类似于 CDATA，因此所有标记都会被忽略并被视为字符。因此，script和style标记内的注释标记将被忽略。不了解脚本或 CSS 的旧版浏览器（2001 年之前）不会将script和style元素视为支持 CDATA 的元素。他们会识别 HTML 注释标签，因此会注释掉它们之间的所有 CSS 和 JavaScript。请注意，有些浏览器确实知道 CSS 和脚本，但也会读取 HTML 注释，因此我们关闭第一个注释 ()，然后它们被迫读取] 块（用于 XHTML 和 XML 解析器）对于这些浏览器来说成为一个空的未知元素，因此被忽略。块中最后的 HTML 注释旨在隐藏从此处到块末尾的所有 CSS 和脚本。最后的是另一个被忽略的空元素，它为那些仍然读取它的人关闭未知的 CDATA 标记。对于 XHTML，这些解析器将这些标记内的所有代码读取为 HTML。它们还需要一个 CDATA 元素来包裹块中的所有 CSS 和 JavaScript，以便它们像 HTML5 浏览器一样运行。他们还没有将这些元素内的内容读取为 CDATA。 XHTML 解析器将读取 HTML 注释标签，但也了解 CSS 和 JavaScript 注释，因此它们将提前结束。然后读取
元素，并为其启动 CDATA 块，因为它是 XHTML W3C 建议中的已知 HTML 元素。然后它会包装标签内的所有样式和脚本，直到]]>结束为止，创建一个真正的 CDATA 包装器，现在可以正确隐藏它们的 XML 字符。 CDATA 块内的所有内容都像 HTML5 解析器现在所做的那样进行解释 - 与普通 CSS 和脚本一样 - 但 XHTML 解析器不再识别其中的 HTML 标记。因为新旧 XHTML 浏览器都知道 CSS 和 JavaScript，所以它们现在仍然可以正确解析和处理该代码，而忽略 XML 保留字符。XML 解析器知道 HTML 注释，但不知道 CSS 和 JavaScript 注释，因此这些解析器会隐藏注释标记之间的所有内容。由于他们不需要了解或解析 CSS 和 JavaScript 代码，因此不需要。
您的 HTML5 页面与现代 HTML5 和 XHTML5 浏览器、较旧的 HTML/XHTML 浏览器、非常旧的 1990 年代不支持 CSS/脚本的浏览器以及各种新旧 XML 解析器完全交叉兼容！享受
HTML5-supporting browsers (and most older browsers going all the way back to 2001) already read the content inside
<style>and<script>tags as CDATA (character data). That means you generally do not need to add CDATA tags inside those elements for most HTML browsers built the past 20 years as they will parse any special characters ok that might popup when adding CSS and JavaScript code between them.However...you do need to add the CDATA block inside
<style>and<script>HTML5 tags if you want your HTML5 page to be compatible with XHTML and XML browsers and parsers, which do need CDATA tags. For that reason, I do recommend you use CDATA in HTML5<style>and<script>tags, but please read on. If you do not do this right, you will break your website!Note: The CDATA tag helps XML parsers ignore special characters that might popup in between those elements, which are part of XML elements, and therefore which would break the markup (like using
<or>characters, for example). Only the<style>and<script>in modern HTML parses have this special feature already built in. That simply means in HTML browsers and parsers they are designed to ignore those weird characters, or rather not read or parse them, as part of the markup. If they did not have built in CDATA properties, your web page, styles, and scripts could break!XML and XHTML parsers will read the
<style>and<script>tag content as they do all HTML elements, as PCDATA (i.e. a normal HTML element), meaning the contents are parsed as markup and potentially break with special characters added in between those tags. You can add special CDATA sections between those two tags to support it. Because XML and XHTML parsers reads everything inside elements as potentially more markup, adding CDATA prevents certain characters from being interpreted as XML or other types of character references.The problem is, most HTML4/HTML5 browsers and parsers don't support adding additional CDATA sections between those tags, so CDATA blocks have to be commented out for those agents if you add them for XHTML/XML support.
Also, note that all HTML comments (
<!--or-->) added inside those tags are ignored by HTML parsers, but implemented by XHTML ones, commenting out CSS and JavaScript for XHTML, when added. Many people in the past would add comment rules between those tags to hide styles and scripts from very old browsers that normally would not understand CSS or Javascript (pre-1998 browsers). But that strategy failed in XHTML without additional code.So how do you combine all that inside
<style>and<script>tags, and should you care?I am a purist and like my HTML5 content to still be XML/XHTML-friendly, regardless of what markup recommendation I am using. I also like my pages to work in browsers that know CSS and older browsers that do not. So here are two solutions to support all those scenarios and still display your styles and scripts in modern browsers without error. They are totally safe to use in modern HTML5 browsers:
STYLE
SCRIPT
ADDITIONAL NOTES
These two code blocks do not change anything in modern HTML5 browsers.
These two code blocks will allow your CSS and JavaScript to work normally as before in HTML5 browsers but hide CSS and JavaScript from very old browsers (pre-2001) that do not support those technologies.
XHTML browsers will now parse your CSS and JavaScript as before but not allow special characters like
<,>, and&to be interpreted as markup or entities/escaped characters which would generate parsing errors. They are CDATA now.XML parsers of your page will not understand your CSS and JavaScript, of course, but will accept any type of text you add in there and not try and parse them as markup. They are CDATA now.
HOW THE EXAMPLES WORK
For modern HTML5-supporting browsers, because
scriptandstyleelements act like CDATA, all markup is ignored and treated as characters. So comment markers<!--and-->insidescriptandstyletags are ignored. Older browsers (pre-2001) that do not know scripts or CSS do not treatscriptandstyleelements as CDATA-supporting elements. They will recognize the HTML comment tags so will comment out all the CSS and JavaScript between them. Note that some browsers do know CSS and scripts but also read the HTML comments, so we close out the first comment (<!--/*-->), then they are forced to read the<![CDATA[/*>block (used for XHTML and XML parsers) which to them becomes an empty unknown element to these browsers and so is ignored. The HTML comment that follows last in the block is designed to hide all the CSS and scripts from there to the end of the block. The final<!]]>is another ignored empty element that closes the unknown CDATA markup tag for those that still read it.For XHTML, these parsers read all the code inside these tags as HTML. They also need a CDATA element wrapped around all CSS and JavaScript in the block so they act like HTML5 browsers. They do not read the content inside these elements as CDATA yet. XHTML parsers will read the HTML comment tags, but knowing CSS and JavaScript comments as well, they will be ended early. The
<![CDATA[element is then read and starts the CDATA block for them, as it is a known HTML element in the XHTML W3C recommendations. It then wraps around all styles and scripts inside the tags till]]>ends it, creating a true CDATA wrapper that now hides XML characters correctly for them. Everything inside the CDATA block is interpreted like HTML5 parsers do now - as normal CSS and scripts - but to the XHTML parser no longer recognize HTML markup inside them. Because old and new XHTML browsers all know CSS and JavaScript, they still parse and process that code correctly now, ignoring XML reserved characters now.XML parsers know HTML comments but not CSS and JavaScript comments, so those parsers would hide everything between the comment tags. Since they do not need to know or parse CSS and JavaScript code, it is not needed.
Your HTML5 page is fully cross-compatible with modern HTML5 and XHTML5 browsers, older HTML/XHTML browsers, very old 1990's non-supporting CSS/script browsers, and various XML parsers, old and new! Enjoy
也许请参阅：http://wiki.whatwg.org/wiki/HTML_vs._XHTML
在 HTML 中，
Perhaps see: http://wiki.whatwg.org/wiki/HTML_vs._XHTML
In HTML,
<script>is already protected -- this is why sometimes it must be written asa = "<" + "/script>", to avoid confusing the browser. Note that the code is valid outside a CDATA in HTML.