什么是console.log?

console.log什么用?

请解释如何在JavaScript中使用它,并附上代码示例。

这不是一个jQueryfunction,而是一个用于debugging的function。 例如,当事情发生时,你可以将某些东西logging到控制台。 例如:

 $('#someButton').click(function() { console.log('#someButton was clicked'); // do something }); 

然后你会看到#someButton was clicked在Firebug的“控制台”选项卡(或另一个工具的控制台 – 例如Chrome的Web检查器),当你点击button。

由于某些原因,控制台对象可能不可用。 然后你可以检查它是否有效,因为当你部署到生产环境时,你不必删除你的debugging代码:

 if (window.console && window.console.log) { // console is available } 

你可以查看控制台的地方! 只是为了让他们在一个答案。

火狐

https://getfirebug.com/

此外,Firefox的内置开发工具Ctrl + Shift + J(工具> Web开发人员>错误控制台)(但Firebug要好得多;使用Firebug)

https://developer.mozilla.org/en-US/docs/Tools

Safari和Chrome

基本上是一样的。

https://developers.google.com/web/tools/chrome-devtools/

https://developer.apple.com/safari/tools/

IE浏览器

不要忘记,您可以使用兼容模式来debuggingIE9或IE10中的IE7和IE8

https://msdn.microsoft.com/en-us/library/gg589507(v=vs.85).aspx

https://msdn.microsoft.com/en-us/library/dd565628(v=vs.85).aspx

如果您必须访问IE6的IE7中的控制台使用Firebug Lite书签

https://getfirebug.com/firebuglite/寻找稳定的书签;

https://en.wikipedia.org/wiki/Bookmarklet

歌剧

https://www.opera.com/dragonfly/

iOS版

适用于所有iPhone,iPod touch和iPad。

https://developer.apple.com/library/content/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/
( 在iOS上debuggingWeb内容的存档链接 )

现在,在iOS 6中,如果插入设备,则可以通过OS X中的Safari查看控制台。 或者你可以使用模拟器,只需打开一个Safari浏览器窗口,然后进入“开发”选项卡。 在那里你可以find选项让Safari检查员与你的设备进行通信。

Windows Phone,Android

这两个都没有内置的控制台,没有书签function。 所以我们使用https://jsconsole.com/ type:listen,它会给你一个脚本标签放置在你的HTML中。 从此,您可以在jsconsole网站中查看您的控制台。

iOS和Android

您还可以使用http://html.adobe.com/edge/inspect/访问networking检查器工具和任何设备上的控制台,使用他们方便的浏览器插件。;


较旧的浏览器问题

最后老的浏览器(再次感谢微软)将崩溃,如果你在你的代码中使用console.log,并没有开发工具在同一时间打开。 幸运的是它很容易修复。 在代码顶部简单地使用下面的代码片段,好的旧IE应该让你一个人待着:

  if(!window.console){ window.console = {log: function(){} }; } 

这将检查控制台是否存在,如果不存在,则将其设置为具有称为log的空白函数的对象。 这种方式window.console和window.console.log从来没有真正的undefined.

如果使用Firebug等工具检查代码,则可以查看任何logging到控制台的消息。 假设你这样做:

 console.log('Testing console'); 

当你使用Firebug访问控制台时(或者你决定使用哪个工具来检查你的代码),你会看到你告诉函数login的任何消息。 当你想要查看某个函数是否正在执行,或者是否正确地传递/分配了一个variables时,这是特别有用的。 对于搞清楚你的​​代码出了什么问题其实是相当有价值的。

它会发布一个日志消息到浏览器的JavaScript控制台,例如Firebug或开发工具(Chrome / Safari),并将显示执行的行和文件。

而且,当你输出一个jQuery对象时,它将在DOM中包含对该元素的引用,并且点击它将会转到Elements / HTML选项卡中。

您可以使用各种方法,但要注意,要在Firefox中工作,您必须打开Firebug,否则整个页面将崩溃。 无论你logging的是variables,数组,对象还是DOM元素,它都会给你一个完整的细分,包括对象的原型(总是有趣的)。 您也可以根据需要添加任意数量的参数,并将其replace为空格。

 console.log( myvar, "Logged!"); console.info( myvar, "Logged!"); console.warn( myvar, "Logged!"); console.debug(myvar, "Logged!"); console.error(myvar, "Logged!"); 

这些显示每个命令不同的标志。

你也可以使用console.profile(profileName); 开始分析函数,脚本等。然后用console.profileEnd(profileName);结束它console.profileEnd(profileName); 它会显示在你的configuration文件选项卡在Chrome中(不知道用FF)。

有关完整的参考资料,请访问http://getfirebug.com/logging ,我build议您阅读它。 (痕迹,群体,剖析,对象检查)。

希望这可以帮助!

与jQuery无关,如果你想使用它,我build议你去做

 if (window.console) { console.log("your message") } 

所以当你的代码不可用的时候,你不要破坏你的代码。

正如评论中所build议的,你也可以在一个地方执行,然后console.log使用console.log

 if (!window.console) { window.console = { log: function(){} }; } 

console.log与jQuery无关。 这是debugging器(包括Chromedebugging器和Firebug)提供的一种通用对象/方法,允许脚本将数据(或大多数情况下的对象)logging到JavaScript控制台。

console.log将debugging信息logging到某些浏览器(安装了Firebug的Firefox,Chrome,IE8,安装了Firebug Lite的任何东西)上的控制台。 在Firefox上,它是一个非常强大的工具,允许您检查对象或检查HTML元素的布局或其他属性。 这与jQuery没有关系,但是在使用jQuery时通常会做两件事情:

  • 安装Firebug的FireQuery扩展。 除此之外,这使得jQuery对象的日志看起来更好。

  • 创build一个更符合jQuery的链式代码约定的包装器。

这通常意味着这样的:

 $.fn.log = function() { if (window.console && console.log) { console.log(this); } return this; } 

然后你可以调用它

 $('foo.bar').find(':baz').log().hide(); 

轻松检查内部jQuery链。

有时候混淆的一点是,要使用console.loglogging文本消息以及其中一个对象的内容,必须将其中的每一个作为不同的parameter passing。 这意味着你必须用逗号分隔它们,因为如果你使用+运算符连接输出,这将隐式地调用你的对象的.toString()方法。 在大多数情况下,这不是显式重写,由Objectinheritance的默认实现不提供任何有用的信息。

在控制台中尝试的示例:

 >>> var myObj = {foo: 'bar'} undefined >>> console.log('myObj is: ', myObj); myObj is: Object { foo= "bar"} 

而如果您尝试连接信息性文本消息以及对象的内容,您将得到:

 >>> console.log('myObj is: ' + myObj); myObj is: [object Object] 

所以请记住,console.log实际上需要尽可能多的参数。

console.log与jQuery无关。

它将消息logging到debugging控制台,如Firebug。

使用console.log将debugging信息添加到您的页面。

很多人为此使用alert(hasNinjas) ,但console.log(hasNinjas)更容易处理。 使用警报popup一个阻止用户界面的模式对话框。

编辑:我同意Baptiste Pernet和JanHančič ,这是一个非常好的主意,检查是否window.console首先定义,以便您的代码不会中断,如果没有控制台可用。

一个例子 – 假设你想知道哪一行代码能够运行你的程序(在它破坏之前),只需input

 console.log("You made it to line 26. But then something went very, very wrong.") 

您可以使用Firebug for Firefox或WebKit浏览器中的JavaScript控制台来debuggingJavaScript代码。

 var variable; console.log(variable); 

它将显示variables的内容,即使它是一个数组或对象。

它类似于print_r($var); 为PHP 。

注意:在生产代码中将调用留在控制台将导致您的站点在Internet Explorer中中断。 永远不要把它解开。 请参阅: https : //web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog

在早期,JSdebugging是通过alert()函数完成的 – 现在这是一个过时的做法。

console.log(); 是写入消息来logindebugging控制台(如Webkit或Firebug)的函数。 在浏览器中,您不会在屏幕上看到任何内容。 它将消息logging到debugging控制台。 它只能在Firebug和基于Webkit的浏览器(Chrome和Safari)中使用。 它在所有IE版本中都不能很好地工作 。

控制台对象是DOM的扩展。

仅在开发和debugging期间, console.log()应该在代码中使用。

有人将console.log()放在生产服务器上的JavaScript文件中被认为是不好的做法。

console.log特别是开发人员编写代码的方法,以不显眼的方式告知开发人员代码正在做什么。 它可以用于提醒您存在问题,但是在debugging代码时不应取代交互式debugging器。 它的asynchronous特性意味着logging值不一定代表方法被调用时的值。

简而言之:使用console.loglogging错误(如果可用),然后使用您select的debugging器修复错误: Firebug ,WebKit Developer Tools(内置于Safari和Chrome ),IE Developer Tools或Visual Studio。

当我启动console.log进行debugging时,我真的感觉到web编程很容易。

 var i; 

如果我想检查i运行时的价值..

 console.log(i); 

你可以检查i在萤火虫的控制台选项卡中的当前值。 它专门用于debugging。

它被用来logging(通过它的任何东西)到Firebug控制台。 主要的用法是debugging你的JavaScript代码。

除了上面提到的用法外, console.log还可以在node.js打印到terminal。 使用express(例如。)创build的服务器可以使用console.log写入输出logging器文件。

如果您的浏览器支持debugging,则可以使用console.log()方法显示JavaScript值。

使用F12在浏览器中激活debugging,并在debugging器菜单中select“控制台”。

在JavaScript中的控制台。 尝试修复或“debugging”一个不起作用的JavaScript程序,并使用console.log()命令来练习。 有一些快捷方式可以帮助您基于您正在使用的浏览器访问JavaScript控制台:

Chrome控制台键盘快捷键

Windows: Ctrl + Shift + J
Mac: Cmd + Option + J

Firefox控制台键盘快捷键

Windows: Ctrl + Shift + K
Mac: Cmd + Option + K

Internet Explorer控制台键盘快捷键

F12

Safari控制台键盘快捷键

Cmd + Option + C

在Java脚本中没有input和输出function。 所以debugging代码使用console.log()方法。这是一种logging方法。 它将被打印在控制台日志(开发工具)下。

它是不存在于IE8和之下,直到你打开IE开发工具。