XSLT 在 Firefox 中破坏 jQuery/Prototype 脚本

Question

我正在做一个学校项目。这是一个带有 XML / XSLT 的互联网页面。 对于设计，我们考虑了背景中的图像褪色效果。

如您所见，我制作了它，它在 IE7 上完美运行。但是在 FF 3.6 中检查它会在 firebug 中引发一些可疑的错误并且不起作用。

例如：

alert($('menu_bg').innerHTML);  

与文档就绪/观察一起使用时有效。但这些都不起作用：

$('#menu_dots').append("content"); // jQuery
$('menu_dots').insert("content");  // prototype

关键是，我不明白为什么在两种浏览器中都可以在没有 XSLT 的情况下正常工作。但是当我对 XSLT 做同样的事情时，它会在 FF 中中断。

http://nak.erline.eu/index.xml

同域/js/_script.js

我认为问题是基于 jQuery 的，这就是我开始将其转换为原型的原因。中途我意识到，问题仍然存在。这就是为什么代码仍然使用 jQuery（注释）和 Prototype。

你有什么想法吗？

Answer 1

在您的 XSLT 文件更改的顶部：

<xsl:output method="xml" indent="yes" 
    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
    doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" />

到

<xsl:output method="html" indent="yes" 
    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
    doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" />

请注意，输出方法类型应为 html 而不是 xml。这解决了我测试中的问题。

我在这里找到了答案的提示：Why does my simple strict XHTML file give errors when I include jquery?

同样在我的测试中，我删除了以下脚本引用

<script src="src/scriptaculous.js" type="text/javascript"/>
<script type="text/javascript" src="js/_script.js"/>

并添加了对 jQuery 的引用

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

并使用您的 jQuery 代码 sn-p 进行测试。

<script>
    $(document).ready(function(){
        $('#menu_dots').append("content");
    });
</script>

Answer 2

如果您必须使用 XSLT、HTML DOM、XML 和跨浏览器功能，我强烈推荐 Sarissa。这将使使用 Microsoft 硬且不兼容的 ActiveX DOM 和所有其他基于 W3C 的 DOM 变得更加容易。

您（可能，不一定）面临的问题是生成的 DOM 对象不属于同一来源的 XML 文档，这是默认的 DOM 行为。结果，jQuery 或 Prototype 无法找到新元素。一种解决方法是将它们作为文本插入并重新解析它们，但这很昂贵。还有其他解决方法，但最简单的可能是看看 Sarissa 并学习使用它。这并不难，并且使您的代码更具可读性。您会发现 Sarissa 会处理这些和其他细微的问题，因此您可以担心更重要的事情..