Answers:
它不是jQuery功能,而是用于调试的功能。例如,您可以在发生某些情况时将某些内容记录到控制台。例如:
$('#someButton').click(function() {
console.log('#someButton was clicked');
// do something
});
然后你会看到#someButton was clicked
在Firebug的“控制台”选项卡(或其他工具的控制台-例如Chrome的Web检查)时,您需要点击按钮。
由于某些原因,控制台对象可能不可用。然后,您可以检查它是否有用-这很有用,因为在部署到生产环境时不必删除调试代码:
if (window.console && window.console.log) {
// console is available
}
if (console.log)
if (console && console.log)
如果控制台不可用,则(甚至)仍会引发错误。您应该使用window.console
(window
保证存在)并且一次只检查一个深度级别。
您可以查看控制台的地方!只是让他们都在一个答案中。
火狐浏览器
(您现在也可以使用Firefox内置的开发人员工具Ctrl + Shift + J(“工具”>“ Web开发者”>“错误控制台”),但是Firebug更好,请使用Firebug)
Safari和Chrome
基本上一样。
https://developers.google.com/chrome-developer-tools/docs/overview
https://developer.apple.com/technologies/safari/developer-tools.html
IE浏览器
别忘了您可以使用兼容模式在IE9或IE10中调试IE7和IE8
http://msdn.microsoft.com/zh-CN/library/ie/gg589507(v=vs.85).aspx
http://msdn.microsoft.com/zh-CN/library/dd565628(v=vs.85).aspx
如果必须在IE6中访问IE7的控制台,请使用Firebug Lite书签
http://getfirebug.com/firebuglite/寻找稳定的书签
http://en.wikipedia.org/wiki/书签
歌剧
http://www.opera.com/dragonfly/
的iOS
适用于所有iPhone,iPod touch和iPad。
现在,在iOS 6中,如果插入设备,则可以通过OS X中的Safari查看控制台。或者,您可以使用仿真器执行此操作,只需打开Safari浏览器窗口,然后转到“开发”标签。在这里,您会找到使Safari检查器与您的设备进行通信的选项。
Windows Phone,Android
这两个都没有内置控制台,也没有书签功能。因此,我们使用 http://jsconsole.com/键入:listen,它将为您提供一个脚本标记以放置在HTML中。从那时起,您可以在jsconsole网站中查看控制台。
iOS和Android
您还可以使用方便的浏览器插件,使用http://html.adobe.com/edge/inspect/来访问Web检查器工具和任何设备上的控制台。
较旧的浏览器问题
最后,如果您在代码中使用console.log并且没有同时打开开发人员工具,则IE的较旧版本将崩溃。幸运的是,这很容易解决。在代码顶部使用以下代码段:
if(!window.console){ window.console = {log: function(){} }; }
这将检查控制台是否存在,如果不存在,则会将其设置为具有名为的空白函数的对象log
。这样window.console和window.console.log永远不会真正实现undefined.
如果使用Firebug等工具检查代码,则可以查看记录到控制台的所有消息。假设您这样做:
console.log('Testing console');
当您在Firebug(或决定使用哪种工具检查代码)中访问控制台时,您将看到告诉该功能进行记录的任何消息。当您要查看函数是否正在执行,或者变量是否正在正确传递/分配时,此功能特别有用。对于弄清楚代码出了什么问题,这实际上非常有价值。
它将日志消息发布到浏览器的JavaScript控制台,例如Firebug或开发人员工具(Chrome / Safari),并显示执行该脚本的行和文件。
此外,当您输出jQuery Object时,它将在DOM中包含对该元素的引用,然后单击它将在Elements / HTML选项卡中转到该元素。
您可以使用多种方法,但是请注意,要使其在Firefox中运行,必须打开Firebug,否则整个页面将崩溃。无论您要记录的是变量,数组,对象还是DOM元素,它都将为您提供完整的细分,包括对象的原型(总是很有趣)。您还可以根据需要添加任意数量的参数,它们将被空格替换。
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);
,它将显示在Chrome的“个人资料”标签中(FF不知道)。
有关完整参考,请访问http://getfirebug.com/logging ,我建议您阅读它。(跟踪,分组,配置文件,对象检查)。
希望这可以帮助!
console.log("x:", x)
优于console.log("x:" + x)
?因为a ,
比a更容易阅读,所以它更容易出错+
吗?
+
严格使用,但是我想表明您也可以在控制台函数中使用逗号。另外,如果两个变量都是整数或数组,则可以避免问题。
console.log("x:", x)
明显更好,因为当x
是对象或数组(或字符串以外的任何东西)时,它可以正确显示,而无需转换为字符串。
与jQuery无关,如果您想使用它,我建议您这样做
if (window.console) {
console.log("your message")
}
因此,当代码不可用时,您不会破坏代码。
如评论中所建议,您也可以在一个地方执行该命令,然后console.log
照常使用
if (!window.console) { window.console = { log: function(){} }; }
if(!window.console){ window.console = function(){}; }
在一处做,然后照常使用console.log。
console.log
在某些浏览器(安装了Firebug的Firefox,Chrome,IE8,以及安装了Firebug Lite的任何浏览器)上将调试信息记录到控制台。在Firefox上,它是一个非常强大的工具,可让您检查对象或检查HTML元素的布局或其他属性。它与jQuery不相关,但是与jQuery结合使用时通常要完成两件事:
安装Firebug 的FireQuery扩展。除其他优点外,这使jQuery对象的日志记录看起来更好。
创建一个更符合jQuery链接代码约定的包装器。
这通常意味着:
$.fn.log = function() {
if (window.console && console.log) {
console.log(this);
}
return this;
}
然后您可以像这样调用
$('foo.bar').find(':baz').log().hide();
轻松检查jQuery链内部。
有时,一个混淆点是,要使用console.log记录一条文本消息以及一个对象的内容,则必须将两个对象中的每个作为不同的参数传递。这意味着您必须用逗号分隔它们,因为如果要使用+运算符连接输出,则将隐式调用.toString()
对象的方法。在大多数情况下,不会显式覆盖此方法,并且继承的默认实现Object
不会提供任何有用的信息。
在控制台中尝试的示例:
>>> 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
添加调试信息到你的页面。
许多人alert(hasNinjas)
为此目的而使用,但是console.log(hasNinjas)
更易于使用。使用警报弹出窗口会弹出阻止用户界面的模式对话框。
编辑:我同意Baptiste Pernet和JanHančič的观点,这是一个非常好的主意,首先检查是否window.console
已定义,以便在没有可用控制台的情况下不会破坏您的代码。
您可以使用它通过Firefox的Firebug或WebKit浏览器中的JavaScript控制台来调试JavaScript代码。
var variable;
console.log(variable);
它将显示变量的内容,即使它是数组或对象也是如此。
这是一个类似print_r($var);
的PHP。
if (!window.console) { window.console = { log : function() {} }; }
。这使您可以不必忘记删除偶尔的调试语句。
当心:在生产代码中留下对控制台的调用将导致您的站点在Internet Explorer中中断。切勿将其打开。参见:https : //web.archive.org/web/20150908041020/blog.patspam.com/2009/the-curse-of-consolelog
早期,JS调试是通过alert()
函数执行的-现在已经过时了。
的console.log()
功能是编写一条消息以登录调试控制台,例如 Webkit或Firebug。在浏览器中,您将不会在屏幕上看到任何内容。它将消息记录到调试控制台。仅在带有Firebug的Firefox和基于Webkit的浏览器(Chrome和Safari)中可用。它并非在所有IE版本中都能正常工作。
控制台对象是DOM的扩展。
本console.log()
应在代码只开发和调试过程中使用。
有人console.log()
将代码留在生产服务器上的javascript文件被视为不良做法。
如果浏览器支持调试,则可以使用console.log()方法显示JavaScript值。
在浏览器中激活调试 F12中的调试,然后在调试器菜单中选择“控制台”。
JavaScript中的控制台。尝试修复或“调试”无法正常运行的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
它用于记录(您传递的所有内容)到Firebug控制台。主要用途是调试JavaScript代码。
这与jQuery无关。该console.log()
被引用到控制台对象的日志功能,它提供了信息记录到浏览器的控制台方法。这些方法仅用于调试目的,不应依赖于向最终用户提供信息。