通过javascript生成html:避免html整洁错误



我有一个通过JavaScript生成HTML的网页。

在Firefox 22中使用HTML验证器0.9.5.1进行验证时,我收到一个错误:'文档类型不允许元素"span"here'

我正在使用以下JavaScript:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 ...<body>...
 <script type='text/javascript'>
var someHtml = '<span>Hello world!</span>';
var e;
e = window.document.createElement('div');
e.innerHTML = someHtml;
window.document.body.appendChild(e);
 </script>

显然,解析器假设<span>嵌套在<script>

我应该如何重写JavaScript以通过HTML验证?我更喜欢一个不需要我创建HTML元素的解决方案。

注意:在jQuery脚本的string/HTML()中避免HTML的答案对我没有帮助,因为我知道代码是有效的。我想重新格式化以避免验证错误。

pre元素用于预格式化的文本,而不是更多的HTML。

HTML Tidy的反对意见是,你放了一些它认为浏览器希望呈现为HTML的东西,你需要对实体进行scape(用&lt;&gt;替换<>),以便将其解释为文本。

针对评论的更新:对于XHTML文档类型,文档必须是格式良好的XML。因此,您需要在脚本标签中使用CDATA标记:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Hello world</title>
  </head>
  <body>
  <script type='text/javascript'>
  //<![CDATA[
  var someHtml = "<div>Hello world!</div>";
  var e;
  e = window.document.createElement('div');
  e.innerHTML = someHtml;
  window.document.body.appendChild(e);
  //]]>
  </script>
  </body>
</html>

不能将<div>放入<pre>中。<pre>只能包含短语内容,而<div>不能。

此外,由于doctype是XHTML,因此应该使用<![CDATA[ ... ]]>部分来包装脚本。

最新更新