Ecmascript/Javascript 适用于 Internet Explorer 但不适用于 FireFox 为什么？答案

【问题标题】：Ecmascript/Javascript works with Internet Explorer but NOT FireFox Why?Ecmascript/Javascript 适用于 Internet Explorer 但不适用于 FireFox 为什么？
【发布时间】：2011-09-20 19:52:33
【问题描述】：

我们有这个有趣的例子来说明我们的 EcmaScript/JavaScript 混淆器是如何工作的。我们提供链接显示未混淆和混淆的 Ecmascript 源代码 “动态时钟”。当您按下开始按钮时，您会看到时钟图形部分跟随您的鼠标移动，当您停止移动鼠标时，它会形成一个滴答作响的圆形时钟。

看这里... http://www.semdesigns.com/Products/Obfuscators/ECMAScriptObfuscationExample.html

未混淆代码和混淆代码在 Internet Explorer 上都可以正常工作，但在 FireFox 上不能正常工作的问题。那么，EcmaScript for FireFox 和 Internet Explorer 之间的区别是什么，导致此代码可以与 Internet Explorer 一起使用，但不能与 FireFox 一起使用是问题所在？我已经尝试了这几个版本的 FireFox，包括最新版本，但都失败了。

【问题讨论】：

您是否尝试过调试您的脚本以找出它中断的地方？不同版本的IE处理JavaScript的方式有很多很多的差异，更不用说一个版本的IE和Firefox之间的差异了
您的代码可以在 no 浏览器中运行，而不是 IE（Opera、Firefox、Chrome）。对不起。是的，有很多不同:)
我会拒绝使用/信任该混淆器，因为它的示例代码看起来像是在 1995 年编写的。我建议您从头开始重写示例。我也担心混淆器代码不好。

标签： javascript firefox

【解决方案1】：

首先要检查的是“错误控制台”或您的 Firebug 控制台 - 找到它取决于您的 Firefox 版本以及您是否安装了 Firebug。

我在试用您的页面时立即在控制台中发现了这个：

Error: document.getElementById("mzSeconds" + i) is null
Source File: http://www.semdesigns.com/Products/Obfuscators/UnobfuscatedJavaScriptMouseClock.js.txt
Line: 19

更新

找到错误后，并且 Dexter 和 jfriend00 已经指出了您首先遇到错误的原因，我们可以看到在这种情况下 IE 和“所有其他”浏览器之间的区别是不是他们如何执行 EcmaScript，但他们如何在面对 HTML 错误时构造 DOM——在您的情况下缺少属性的右引号。（虽然有一些与这里无关的脚本差异）

您的document.write() 将输出无效的<div id="mzSeconds0 style="position:...">，导致另一个调试工具：验证。

如果 CSS 规则或 Javascript 代码在不同浏览器中的行为异常或不一致，最好验证您的 HTML（validator.w3.org），因为不同的浏览器会以不同的方式解析无效的 HTML。

【讨论】：

这只是第一条线索。要找到真正的问题，需要进一步追踪线索。有关根本问题，请参阅 Dexter 和 jfriend00 的答案。
@jfriend00 - 是的，我一发现错误就发布了这个，然后开始寻找原因。当我找到它时，你和德克斯特已经发布了。

【解决方案2】：

您的直接问题是您正在生成无效的 HTML 代码，将其附加到 DOM，然后尝试使用 document.getElementById 再次找到它。

违规部分是UnobfuscatedHTMLPage.html 的第 100 行，其中包含以下行：

document.write('<div id="'+(('mzSeconds'))+i+' style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');

你在id="'+(('mzSeconds'))+i+' 之后缺少了结束符 "，这会导致 div 标签的 id 在 IE 中被错误地处理（在这种情况下，两个错误是正确的）。

该部分代码中有许多类似的错误 - 您需要全部修复（通过在 Firebug 或 Chrome 开发人员工具中调试您的代码），您的代码才能在非 IE 浏览器中有效并工作。

【讨论】：

【解决方案3】：

在任何浏览器的调试控制台中非常简单地查看它不工作的任何浏览器都会显示错误在哪里（我使用的是 Chrome）。然后，查看 DOM 会告诉您为什么会发生该错误。使用调试工具找出问题。

我认为根本问题在于，当您生成 HTML 时，您缺少一些右引号。这会创建非法的 HTML，不同的浏览器会以不同的方式拒绝。

您的代码中的第一个错误被触发，因为不存在带有id="mzSeconds0" 的对象。这是因为您在此行中缺少右双引号：

document.write('<div id="'+(('mzSeconds'))+i+' style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');

应该是id="mzSeconds0"结尾的双引号：

document.write('<div id="'+(('mzSeconds'))+i+'" style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');

我认为大多数这些类型的行都存在相同的错误，您需要将它们全部修复。

【讨论】：

【解决方案4】：

检查调试器会产生：document.getElementById("mzSeconds" + i) 为空，还包括行号和堆栈跟踪，这应该可以让您轻松修复错误。

原因是您向浏览器抛出了无效的 HTML，需要尝试以某种方式纠正它。显然，您最终会在 IE 和 Firefox 中拥有不同的 DOM。

document.write('<div id="'+(('mzMinutes'))+i+' style="position:absol…

我仍然没有看到使用混淆 JavaScript 或按照您的风格编写代码。直接编写 HTML 而不是滥用 JavaScript。当您需要从 JavaScript 创建内容时，请使用 DOM 函数而不是 document.write。这将使您摆脱这个错误。

当您将代码运行到调试器 (Firebug) 时，您会发现弹出其他错误。请务必查看 JavaScript 严格模式，因为它可能会通过指出不良做法为您节省大量时间。

【讨论】：