未捕获的TypeError：无法读取未定义的属性“长度”

Question

我有一个插件可以访问许多元素上的length属性。但是，javascript控制台指向jquery.min.js的第12行。

如何在我的插件中回溯以查找有问题的行？

Answer 1

如果您使用缩小的脚本，任何调试器（如完全最好的firebug）将向您显示相同的有问题的行，并且此信息无用（缩小的脚本难以阅读和理解，并且它们写在一行中）。

解决这类问题的方法很少：

1. 正如我之前所说的那样：为了开发使用而不是缩小脚本，调试器会向您显示意味着什么的行，如果您很幸运，您可以找到非常有用的开发人员评论。
2. 如果找不到完整版本的脚本，请使用这样的unminifier：http://jsbeautifier.org/（粘贴缩小的脚本并单击下面的按钮）。添加到项目的已发布脚本并再次运行无效功能。再次调试器将显示该行，但这次您将看到一条真实的逻辑行，您可以在大多数情况下了解问题所在。
3. 调试器将显示哪个脚本引发问题。检查此脚本是否有任何新版本。我曾经遇到过同样的问题，找到了缩小脚本的行，插件的名称（版权所有上面几行），然后发现有新版本可用。审核了更改日志，并且：“在整个代码中为潜在的未知属性值添加了多个'健全性检查'” - headshot :)更新了脚本，从现在开始一切都很好，无需特殊调试，需要数小时。
4. 谷歌你的错误与脚本名称 - 它帮了我很多次..可能你做了，但也许你没有尝试使用语音标记“” - 谷歌将返回带有文字中的确切短语的页面。

Answer 2

  

如何在我的插件中回溯以查找有问题的行？

firebug 是调试这些错误的好方法。

alt text http://blog.getfirebug.com/wp-content/uploads/2010/05/disable-debugger-keyword.png

Answer 3

如果您使用Chrome，则可以转到"View > Developer > Developer Tools"使用内置开发人员工具（我更喜欢Firebug）。控制台中的错误通常会在它之前有一个小的向右箭头，点击它时会显示有关错误的更多详细信息。

Javascript错误不太可能来自库，而是引用该库中的方法/函数的代码，因此您希望查看控制台右侧列出的所有问题行并选择该行这与您编写的代码相对应，这将是您的问题所在。

通过查看jQuery的源代码，您不太可能找出问题所在。问题出在您的代码中。只是jQuery不能使用你传递给它的未定义变量。

Answer 4

我经常发现这些模糊的框架错误是AJAX请求错误的结果。如果是这种情况，您的Developer Tool Of Choice很可能包含一个Network选项卡，这可能会突出显示错误的真正来源。

如果您使用jQuery（或任何JavaScript框架）来处理AJAX请求的结果，那么格式化和处理错误都是额外且经常被忽视的步骤。

Answer 5

除了调试器/ firebug之外，跟踪它的一种简单方法（如果你有一个沙盒版本的网站）是单独注释掉每个插件并检查错误是否消失。