无法在 CDATA 中运行 JavaScript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9590427/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can't run JavaScript in CDATA
提问by Mike Starov
I am trying to run following HTML in every browser: Opera, FF, IE, Chrome
我试图在每个浏览器中运行以下 HTML：Opera、FF、IE、Chrome
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8">
</head>
<body>
<script>
<![CDATA[
alert('Hey!');
]]>
</script>
</body>
</html>
None of them display the alert. Chrome logs an error in console: Uncaught SyntaxError: Unexpected token <. It seems to be complaining about the fist < in CDATA declaration. Firefox also logs "syntax error"
他们都没有显示警报。Chrome 在控制台中记录错误：Uncaught SyntaxError: Unexpected token <。它似乎在抱怨 CDATA 声明中的第一个 <。Firefox 还会记录“语法错误”
The w3schools point out that this is the way to use CDATA http://www.w3schools.com/xml/xml_cdata.asp. Other answerson this site suggest it. What am I doing wrong? I tried playing with namespaces and doctypes, but that did not change anything.
w3schools 指出这是使用 CDATA http://www.w3schools.com/xml/xml_cdata.asp 的方式。本网站上的其他答案表明了这一点。我究竟做错了什么？我尝试使用命名空间和文档类型，但这并没有改变任何东西。
Edit: I added XHTML name space and doctype, that I originally removed and the problem still persists.
编辑：我添加了最初删除的 XHTML 名称空间和文档类型，但问题仍然存在。
回答by danorton
The difference is between HTML and XHTML. W3Schools is correct that it's a valid CDATA construct within XHTML, but as your question indicates that your code is HTML and there is no such thing as CDATA inside a <script>in HTML, your example fails as soon as the interpreter sees the "<". You can tell the browser that it's looking at XHTML, but it's probably safer to handle HTML, too. To do that, you need to hide the CDATA inside JavaScript comments. (You might also consider identifying which language is inside your <script>block.)
区别在于 HTML 和 XHTML 之间。W3Schools 是正确的，它是 XHTML 中的有效 CDATA 构造，但是由于您的问题表明您的代码是 HTML，并且<script>HTML 中的a中没有 CDATA 这样的东西，一旦解释器看到“<”，您的示例就会失败。您可以告诉浏览器它正在查看 XHTML，但处理 HTML 也可能更安全。为此，您需要将 CDATA 隐藏在 JavaScript 注释中。（您也可以考虑确定您的<script>区块内使用的是哪种语言。）
<html>
<head>
</head>
<body>
<script>
//<![CDATA[
alert('Hey!');
//]]>
</script>
</body>
</html>
This is, in fact, the method recommended by the World Wide Web Consortium (W3C) in XHTML Media Types, A.4. Embedded Style Sheets and Scripts.
这实际上是万维网联盟 (W3C) 在XHTML 媒体类型 A.4 中推荐的方法。嵌入式样式表和脚本。
回答by Pekka
The related question When is a CDATA section necessary within a script tag?explains that a CDATA section is recommended when embedding scripts in XHTML documents. However, just setting a XHTML doctype to the test document isn't enough. The CDATA is still being treated as a syntax error.
相关问题 脚本标记中何时需要 CDATA 部分？解释了在 XHTML 文档中嵌入脚本时推荐使用 CDATA 部分。然而，仅仅为测试文档设置一个 XHTML 文档类型是不够的。CDATA 仍被视为语法错误。
According to this blog post, that is because the content type needs to match the doctype definition. Proper XHTML needs to have the following Content-typeheader set:
根据这篇博客文章，这是因为内容类型需要匹配 doctype 定义。正确的 XHTML 需要Content-type设置以下标头：
Content-type: application/xhtml+xml
if that is not specified and text/htmlsent instead, browsers will revert to HTML. And indeed, if I add that header to my test case, browsers start properly parsing the JavaScript inside the CDATA even when the CDATA it's not commented out.
如果没有指定并text/html发送，浏览器将恢复为 HTML。事实上，如果我将该标头添加到我的测试用例中，即使 CDATA 没有被注释掉，浏览器也会开始正确解析 CDATA 中的 JavaScript。
This works for me (setting the header using PHP):
这对我有用（使用 PHP 设置标题）：
<?php header("Content-type: application/xhtml+xml");
echo '<?xml version="1.0" encoding="UTF-8"?>'; ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script><![CDATA[alert('Hey!');]]></script>
</head>
<body>
</body>
</html>?
回答by Alohci
You may see it as XML (XHTML) but that's not how the browser sees it.
您可能会将其视为 XML (XHTML)，但这不是浏览器所看到的。
You're serving it a text/htmlwhich means that the browser sees it as HTML.
您正在为它提供 atext/html这意味着浏览器将其视为 HTML。
It needs to be served with an XML mime type such as application/xhtml+xml
它需要与 XML MIME 类型一起提供，例如 application/xhtml+xml
i.e. like this
即像这样
http://www.alohci.net/application/xhtml+xml/starov.htm.ashx
http://www.alohci.net/application/xhtml+xml/starov.htm.ashx
and not like this
而不是这样
http://www.alohci.net/text/html/starov.htm.ashx
http://www.alohci.net/text/html/starov.htm.ashx
Check the view source to see that it's the same file. Check the "Net" tab in firebug (or the equivalent for your browser) to see the content type in the response headers.
检查视图源以查看它是同一个文件。检查 firebug 中的“Net”选项卡（或浏览器的等效选项）以查看响应标头中的内容类型。
回答by rjz
Also, you need to comment out the CDATA so it won't throw a parsing error when it's run:
此外，您需要注释掉 CDATA，这样它在运行时就不会抛出解析错误：
<script>
//<![CDATA[
alert('Hey!');
//]]>
</script>
回答by Daniel Moses
1) Comment your CDATA
1) 评论您的 CDATA
//<![CDATA[
alert('Hey!');
//]]>
2) add a script type
2) 添加脚本类型
<script type="text/javascript">
