IE8在使用prototype.js时出错“无效参数”，如何找到错误的位置？

Question

我有一个相当复杂的Javascript，在Google Chrome，Firefox，Safari和Opera中没有任何错误，可以完美运行。 但是，由于往往总是令人讨厌的情况，它在Internet Explorer中完全失败。 我已经在IE7和IE8中测试过并得到了同样的错误：

无效的论点。 prototype.js，第2216行，第9个字符

我正在使用通过Google托管的Prototype 1.6.1。 给出的错误不是很有帮助，因为它没有告诉我在实际代码中发生错误的位置。 错误中提到的行是以下代码中底部的第6行：

setStyle: function(element, styles) {
    element = $(element);
    var elementStyle = element.style, match;
    if (Object.isString(styles)) {
      element.style.cssText += ';' + styles;
      return styles.include('opacity') ?
        element.setOpacity(styles.match(/opacity:\s*(\d?\.?\d*)/)[1]) : element;
    }
    for (var property in styles)
      if (property == 'opacity') element.setOpacity(styles[property]);
      else
        elementStyle[(property == 'float' || property == 'cssFloat') ?
          (Object.isUndefined(elementStyle.styleFloat) ? 'cssFloat' : 'styleFloat') :
            property] = styles[property];

    return element;
  },

因为它在setStyle代码块中，所以我假设当我为某个元素设置样式属性时会发生错误。 但是，我在这个脚本中调用了setStyle超过100次，并且一直试图弄清楚错误发生在几个小时的确切位置。 我能做些什么来帮助自己找到发生错误的地方吗？

Answer 1

明确try ... catch代码：

for (var property in styles) {
  try {
    if (property == 'opacity') element.setOpacity(styles[property]);
    else
      elementStyle[(property == 'float' || property == 'cssFloat') ?
        (Object.isUndefined(elementStyle.styleFloat) ? 'cssFloat' : 'styleFloat') :
          property] = styles[property];
  }
  catch (_) {
    throw "Error setting property '" + property + "' to value '" + styles[property] + "'";
  }
}

然后你就会确切地知道导致问题的属性和价值。

Answer 2

在IE8中，启用开发人员工具以解决错误[脚本选项卡上的第5个按钮。]单击“ 开始调试”按钮。

发生错误时，您应该能够检查变量并查看导致问题的原因。

Answer 3

问题是由setStyle({someProperty: null}) 。 也许也是undefined或某种东西。

要在将来调查此类问题，请检查您在catch块中为第三方函数提供的参数。 的种类

try{
  element.setStyle({someProperty: someValue})
}catch(error){
  throw('' + someProperty + ':' + someValue)
}

此代码会指向零时间内的错误源。 以下是使用Prototype.js帮助程序调试此案例的更详细的代码段：

;(function () {
  var superFunction = Element.setStyle
  Element.addMethods({
    setStyle: function (element, _arguments) {
      try{
        superFunction(element, _arguments)
      }catch(error){
        console.log(error, $H(_arguments).inspect())
      }
    }
  })
})()

在IE8中PS你应该打开开发人员工具（F12）让console工作。

Answer 4

尝试使用Microsoft®VisualWebDeveloper®2010Express进行调试，在IE上进行调试时，它是免费且易于使用的。

Answer 5

你已经标记了你选择的答案，所以现在可能找到了原因。 有问题的行涉及设置不透明度（IE处理它作为专有过滤器）所以我建议寻找设置不透明度的setStyle调用，也许是设置异常值的调用。