好的,所以我希望这个问题对你们来说不是基本的。
我知道足够的jQuery让自己陷入困境,这意味着我可以抓住元素并用它做些事情,编写我自己的小功能以实现交互性等。但是在我将问题发布到stackoverflow并获得让我自己调试自己的答案之前,有些东西没有达到预期的效果,我想自己调试它并且厌倦了将alert();
插入到我的代码中。在阅读这个主题时,提到了console.log();
,console.info();
等等,但我找不到任何解释如何在现实场景中使用这些资源进行调试的资源。
你们中的任何人都知道一个好的资源或教程(不怕读书)可以解释如何将这些功能用于外行。似乎我找到的教程和其他方法是高级或只是略过表面,而不是告诉你如何使用它们。我了解我可以插入console.log();
,它会在控制台中为firebug
或element inspector
吐出信息。但是,如果我的手工烘焙功能在某个地方做了一些意想不到的事情,那么当浏览器解析javascript时如何找到问题呢。
任何帮助都会非常感激,因为我觉得学习这将有助于我理解我的代码中发生了什么,所以我可以停止盯着屏幕“为什么这不起作用,它在jsfiddle
!”
答案 0 :(得分:9)
console.log()只需传递给它的任何内容并将其写入控制台的日志窗口。如果传入数组,则可以检查数组的内容。传入一个对象,可以检查对象的属性/方法。传入一个字符串,它将记录字符串。基本上它是“document.write”,但可以智能地拆分它的参数并将它们写出来。
输出偶尔的调试信息很有用,但如果你有大量的调试输出则不是特别有用。
要观察脚本的执行情况,您可以使用调试器,它允许您逐行逐步执行代码。当你需要显示一些变量的内容供以后检查,但不想中断执行时,使用console.log。
答案 1 :(得分:2)
学习使用javascript调试器。 Venkman(适用于Firefox)或Web Inspector(Chome& Safari的一部分)是用于调试正在进行的操作的绝佳工具。
您可以在与脚本交互时设置断点并查询机器的状态;逐步执行部分代码以确保一切按计划运行,等等。
这是excellent write up from WebMonkey on JavaScript Debugging for Beginners。这是一个很好的起点。
答案 2 :(得分:2)
我喜欢在头脑中添加这些功能。
window.log=function(){if(this.console){console.log(Array.prototype.slice.call(arguments));}};
jQuery.fn.log=function (msg){console.log("%s: %o", msg,this);return this;};
现在日志不会破坏IE 我可以在一个地方启用它或禁用它 我可以在线登录
$(".classname").log(); //show an array of all elements with classname class
答案 3 :(得分:1)
基本上console.log()
允许您在选择的javascript调试器中输出变量,而不是每次要检查某些内容时闪烁alert()
...此外,对于更复杂的对象,它将为您提供树视图以进一步检查对象,而不必将元素转换为像alert()
这样的字符串。
答案 4 :(得分:0)
断点,特别是条件断点是你的朋友。
另外你可以编写一个小的断言函数来检查值并在调试版本的站点中需要时抛出异常(某些变量设置为true或url有一些参数)