修复 HTML Validator 引发的警告

Posted 2023-02-24

【中文标题】修复 HTML Validator 引发的警告

【英文标题】：Fix a warning thrown by HTML Validator

【发布时间】：2010-12-18 00:49:30

【问题描述】：

我的 php 网站中有一些 javascript 代码。 此代码使用 jQuery，并使用 ajax 调用构建了一个 菜单。

这里是代码

sel.append('<option value="' + data[i].id + '">' + data[i].nombre + '</option>');

这给了我以下警告

第 240 行第 82 列 - 警告：'

有谁知道我该如何解决这个警告，以便我的 html 验证？谢谢

【问题讨论】：

您是否尝试过使用字符代码？

警告从何而来？ W3C HTML 验证器？

@christopher-w-allen-polle：我会试试的！ @powtac：是的，我在 Firefox 中使用 HTML Validator 扩展

【参考方案1】：

问题是任何</ 序列 — 称为 ETGO — 结束一个 CDATA 元素，例如 <script>。您可以在浏览器中使用</，但不能使用</script。

最简单的解决方法是使用反斜杠转义符分解</ 序列：

sel.append('<option value="' + data[i].id + '">' + data[i].nombre + '<\/option>');

但是，这一行仍然存在问题，因为您没有对 id 和 nombre 值进行 HTML 转义。如果它们可能包含<、& 或"，那么你已经为自己构建了一个客户端 XSS 漏洞！

因此，要么在将文本值放入字符串之前对它们进行 HTML 转义，要么更简单地使用标准 DOM：

sel.append(new Option(data[i].nombre, data[i].id));

【讨论】：

（使用标准 DOM）++。 innerHTML 又快又脏，但大部分都是脏的。

嗨 bobince，我认为您的回答是最佳选择。我尝试了 sel.append (new Option...) 并且工作了。现在我的“子问题”是，如何添加具有某些属性的选项？像 class="firstoption"、id 等？希望你能理解我

你可以说var option= new Option(...)，然后将其视为任何其他DOM元素，例如option.className= 'firstoption';或jQuery $(option).addClass('firstoption');。

【参考方案2】：

要在 XHTML 文档中包含未编码为 XML 的代码（我猜这就是您想要做的），您需要执行以下操作：

<script type="text/javascript">
//<![CDATA[

alert("<This is now valid XHTML>");

//]]>
</script>

【讨论】：

这是在 XHTML 中处理内联脚本的一个可以容忍的解决方案——但验证器会抱怨 <option 而不是 </，所以问题是关于 HTML。

【参考方案3】：

如果你是在 html/xhtml 页面中编写 javascript，你可以将 javascript 包含在 CDATA 中

<script type="text/javascript">
/* <![CDATA[ */
console.log("..js code here..");
/* ]]> */
</script> 

【讨论】：

XML CDATA 部分中的</ 序列在用作 HTML 时仍然无效，而 XHTML 几乎总是如此。 CDATA 部分中的</script 序列仍然会破坏 HTML 浏览器。

【参考方案4】：

将<!-- 和--> 放在您的代码周围。

【讨论】：

这是针对 Netscape 2.0 时代浏览器的 hack ......这不会解决这个问题。

对 HTML4（或 HTML 3.2！）没有影响。打破 XML 中的脚本。

它不起作用（对于给定的问题），如果它是 XHTML，浏览器会忽略整个脚本（除非它在 ​​text/html 中提供）。啊。我讨厌 XHTML 作为 text/html。

<!--...--> 是 JavaScript 1.6+ 中的 XML 注释文字

【参考方案5】：

将 javascript 放在外部文件中。