Ecmascript / Javascript可与Internet Explorer一起使用，但不能与FireFox一起使用，为什么？

Question

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

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

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

Answer 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将通过不同的浏览器不同的方式进行解析。

Answer 2

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

令人反感的部分是UnobfuscatedHTMLPage.html第100 UnobfuscatedHTMLPage.html ，其中包含以下行：

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+'之后立即丢失了结束id="'+(('mzSeconds'))+i+' ，这导致div标记的ID在IE中无法正确处理（在这种情况下，有两个错误使之正确） 。

该段代码中存在许多类似的错误-您需要先解决所有问题（通过在Firebug或Chrome开发者工具中调试代码），然后代码才能生效并在非IE浏览器中运行。

Answer 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>');

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

Answer 4

检查调试器的结果是： document.getElementById（“ mzSeconds” + i）为null，并且还包括行号和堆栈跟踪，这使您更容易修复错误。

原因是您向浏览器抛出了无效的HTML，需要尝试以某种方式对其进行更正。 显然，您最终在IE和Firefox中拥有另一个DOM。

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

我仍然看不到使用混淆的JavaScript或以您的样式编写代码的用法。 直接编写HTML，而不是滥用JavaScript。 当您需要从JavaScript创建内容时，请使用DOM函数代替document.write 。 这样可以避免您遇到此错误。

将代码运行到调试器（Firebug）时，您会发现其他错误。 也请查看JavaScript严格模式，因为它可能会指出一些不良做法，从而为您节省大量时间。