XHTML 兼容性 - 将 HTML 存储在 Javascript 变量中答案

【问题标题】：XHTML Compatibility - Storing HTML in a Javascript variableXHTML 兼容性 - 将 HTML 存储在 Javascript 变量中
【发布时间】：2011-02-16 19:04:08
【问题描述】：

我被难住了。我正在将我的文档类型转换为 XHTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

这样做后，我遇到了验证问题。我正在使用 Dynamic Drive 的 Ultimate Fade-in 幻灯片（可在此处找到：http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm）并从数据库中输入我的所有变量。为了使它工作，我必须填充一些 javascript 变量。

在我使用数据库写出我的 javascript 后，我得到以下结果：

<script type='text/javascript'>
var img1, img2, im3, img4, lnk1, lnk2, lnk3, lnk4, txt1, txt2, txt3, txt4;

img1 = "image1.jpg";
lnk1 = "/link1.php";
txt1 = "<font style='font-size: 14px;'><a href='/link1.php'>Article 1</a></font><br />Article 1 Content...";
img2 = "image2.jpg";
lnk2 = "/link2.php";
txt2 = "<font style='font-size: 14px;'><a href='/link2.php'>Article 2</a></font><br />Article 2 Content...";
img3 = "image3.jpg";
lnk3 = "/link3.php";
txt3 = "<font style='font-size: 14px;'><a href='/link3.php'>Article 3</a></font><br />Article 3 Content...";
img4 = "image4.jpg";
lnk4 = "/link4.php";
txt4 = "<font style='font-size: 14px;'><a href='/link4.php'>Article 4</a></font><br />Article 4 Content...";

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
    dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
    imagearray: [
        [img1, lnk1, "", txt1],
        [img2, lnk2, "", txt2],
        [img3, lnk3, "", txt3],
        [img4, lnk4, "", txt4] // no trailing comma after very last image element!
    ],
    displaymode: {type:'auto', pause:5000, cycles:0, wraparound:false},
    persist: false, //remember last viewed slide and recall within same session?
    fadeduration: 500, //transition duration (milliseconds)
    descreveal: "always",
    togglerid: ""
})
</script>

我收到一些验证错误，这些错误都指向我存储在 txt[x] 变量中的 html 代码。

样品：第 239 行，第 39 列：文档类型在此处不允许元素“字体”

txt1 = "<font style='font-size: 14px;'><a href='/link1.php…

第 239 行，第 126 列：文档类型在此处不允许元素“br”

…Article 1</a></font><br />Article 1 Content …

我是否遗漏了一些明显的东西？或者当涉及到与 XHTML 兼容时，javascript 变量中的 HTML 文本不是一个选项？

【问题讨论】：

我认为您的问题在于<font> 标签本身。如果我弄错了，它已经贬值了。你应该使用 css 来设置文本样式

标签： javascript xhtml

【解决方案1】：

你使用的是什么验证器？

w3c 验证器不会忽略脚本标签中的内容，因此如果您的脚本中有 HTML，验证器将尝试将其验证为 XHTML。

将您的脚本放入一个单独的文件中。

另外，如果要通过脚本插入 HTML4 标签，为什么还要担心验证？

【讨论】：

我正在使用link。我不确定我是否可以将脚本移动到单独的文件中，因为在脚本内部是我循环查询结果以动态写出我的 javascript 变量值的地方。至于字体标签，我放弃了它们已被弃用并且验证器没有标记它们，可能是因为我使用的是过渡。
@Micah - 你考虑过在服务器端生成 js 吗？我不知道您使用的是什么网络框架，但我确信有办法做到这一点。在 Django 上，您可以使用模板生成 js。
服务器端正在生成违规代码。我将大部分脚本直接写入 php 页面，所有静态内容，但我有一个数据库循环，它正在写入填充服务器端 javascript 变量的所有值。当 W3C 验证器查看它时，所有服务器端的东西都完成了。所以我有我的变量，比如txt1 = "<a href='link1.php'>Title</a><br />Text，而验证器的 a 标签和 br 标签有问题。我确实尝试将其拆分为 .js，但不确定您是否运行 php 代码以在 .js 中循环遍历我的查询结果
验证者不喜欢在你的脚本中嵌入标签。
我很确定您可以使用 php 生成动态 .js

【解决方案2】：

font 在 HTML 4 Strict 和 XHTML 中已弃用。使用正确的语义元素并为其设置样式，在本例中为 a。

【讨论】：

感谢您的回复！好的，为了测试这一点，我删除了标签。所以错误已经改变。问题似乎是它不喜欢我的任何 HTML 标签。它似乎也不喜欢我的标签或
。
@Micah - 按照我在回答中所说的去做。将您的脚本放在一个单独的文件中。