JavaScript:如何将消息打印到错误控制台?

How can I print a message to the error console, preferably including a variable?

如何将消息打印到错误控制台(最好包含一个变量)?

For example, something like:

例如,类似:

print('x=%d', x);

18 个解决方案

#1

Install Firebug and then you can use console.log(...) and console.debug(...), etc. (see the documentation for more).

安装Firebug，然后可以使用console.log(…)和console.debug(…)等(更多信息请参阅文档)。

#2

console.error(message); //gives you the red errormessage
console.log(message); //gives the default message
console.warn(message); //gives the warn message with the exclamation mark in front of it
console.info(message); //gives an info message with an 'i' in front of the message

You also can add CSS to your logging messages:

您还可以将CSS添加到日志消息中:

console.log('%c My message here', "background: blue; color: black; padding-left:10px;");

#3

Exceptions are logged into the JavaScript console. You can use that if you want to keep Firebug disabled.

异常被记录到JavaScript控制台。如果想要禁用Firebug，可以使用它。

function log(msg) {
    setTimeout(function() {
        throw new Error(msg);
    }, 0);
}

Usage:

用法:

log('Hello World');
log('another message');

#4

One good way to do this that works cross-browser is outlined in Debugging JavaScript: Throw Away Your Alerts!.

一种很好的方法是在调试JavaScript中概述了跨浏览器的工作:扔掉您的警报!

#5

If you use Safari, you can write

如果您使用Safari，您可以编写

console.log("your message here");

and it appears right on the console of the browser.

它就出现在浏览器的控制台。

#6

Here is a solution to the literal question of how to print a message to the browser's error console, not the debugger console. (There might be good reasons to bypass the debugger.)

这里有一个关于如何将消息打印到浏览器的错误控制台的解决方案，而不是调试器控制台。(绕过调试器可能有很好的理由。)

As I noted in comments about the suggestion to throw an error to get a message in the error console, one problem is that this will interrupt the thread of execution. If you don't want to interrupt the thread, you can throw the error in a separate thread, one created using setTimeout. Hence my solution (which turns out to be an elaboration of the one by Ivo Danihelka):

正如我在有关在错误控制台中抛出错误以获取消息的建议的评论中所指出的，一个问题是这会中断执行线程。如果不想中断线程，可以将错误抛出到另一个线程中，这个线程是使用setTimeout创建的。因此，我的解决方案(原来是Ivo Danihelka的方案):

var startTime = (new Date()).getTime();
function logError(msg)
{
  var milliseconds = (new Date()).getTime() - startTime;
  window.setTimeout(function () {
    throw( new Error(milliseconds + ': ' + msg, "") );
  });
}
logError('testing');

I include the time in milliseconds since the start time because the timeout could skew the order in which you might expect to see the messages.

我将从开始时间开始算起的时间(以毫秒为单位)包含进来，因为超时可能会影响您看到消息的顺序。

The second argument to the Error method is for the filename, which is an empty string here to prevent output of the useless filename and line number. It is possible to get the caller function but not in a simple browser independent way.

Error方法的第二个参数是文件名，它是一个空字符串，用于防止输出无用的文件名和行号。可以获得调用者函数，但不能使用简单的独立浏览器。

It would be nice if we could display the message with a warning or message icon instead of the error icon, but I can't find a way to do that.

如果我们可以用警告或消息图标而不是错误图标来显示消息，那就太好了，但是我找不到这样做的方法。

Another problem with using throw is that it could be caught and thrown away by an enclosing try-catch, and putting the throw in a separate thread avoids that obstacle as well. However, there is yet another way the error could be caught, which is if the window.onerror handler is replaced with one that does something different. Can't help you there.

使用throw的另一个问题是，它可能被一个封闭的try-catch捕获并丢弃，并且将抛出放在一个单独的线程中也可以避免这个障碍。然而，还有另一种方法可以捕获错误，即如果窗口。onerror处理程序被替换为做不同事情的处理程序。帮不了你。

#7

To actually answer the question:

来回答这个问题

console.error('An error occurred!');
console.error('An error occurred! ', 'My variable = ', myVar);
console.error('An error occurred! ' + 'My variable = ' + myVar);

Instead of error, you can also use info, log or warn.

您也可以使用info、log或warn来代替错误。

#8

If you are using Firebug and need to support IE, Safari or Opera as well, Firebug Lite adds console.log() support to these browsers.

如果您正在使用Firebug，并且需要支持IE、Safari或Opera，那么Firebug Lite会向这些浏览器添加console.log()支持。

#9

A note about 'throw()' mentioned above. It seems that it stops execution of the page completely (I checked in IE8) , so it's not very useful for logging "on going processes" (like to track a certain variable...)

上面提到的关于“throw()”的注意事项。它似乎完全停止了页面的执行(我在IE8中进行了检查)，因此它对于记录“正在进行的进程”(比如跟踪某个变量…)不是很有用。

My suggestion is perhaps to add a textarea element somewhere in your document and to change (or append to) its value (which would change its text) for logging information whenever needed...

我的建议可能是在文档的某个地方添加一个textarea元素，并在需要的时候更改(或追加)其值(将更改其文本)以记录信息……

#10

The WebKit Web Inspector also supports Firebug's console API (just a minor addition to Dan's answer).

WebKit Web检查器还支持Firebug的控制台API(这只是丹的回答的一个小补充)。

#11

As always, Internet Explorer is the big elephant in rollerskates that stops you just simply using console.log().

一如既往，Internet Explorer是rollerskates中的庞然大物，仅使用console.log()就能阻止您。

jQuery's log can be adapted quite easily, but is a pain having to add it everywhere. One solution if you're using jQuery is to put it into your jQuery file at the end, minified first:

jQuery的日志可以很容易地进行调整，但是在任何地方都要添加它是很痛苦的。使用jQuery的一种解决方案是最后将其放入jQuery文件中，先缩小:

function log()
{
    if (arguments.length > 0)
    {
        // Join for graceful degregation
        var args = (arguments.length > 1) ? Array.prototype.join.call(arguments, " ") : arguments[0];

        // This is the standard; Firebug and newer WebKit browsers support this.
        try {
            console.log(args);
            return true;
        } catch(e) {
            // Newer Opera browsers support posting erros to their consoles.
            try {
                opera.postError(args);
                return true;
            } 
            catch(e) 
            {
            }
        }

        // Catch all; a good old alert box.
        alert(args);
        return false;
    }
}

#12

Visit https://developer.chrome.com/devtools/docs/console-api for a complete console api reference

访问https://developer.chrome.com/devtools/docs/console-api，以获得完整的控制台api引用。

    console.error(object[Obj,....])\

In this case, object would be your error string

在这种情况下，对象将是您的错误字符串

#13

function foo() {
  function bar() {
    console.trace("Tracing is Done here");
  }
  bar();
}

foo();

console.log(console); //to print console object
console.clear('console.clear'); //to clear console
console.log('console.log'); //to print log message
console.info('console.info'); //to print log message 
console.debug('console.debug'); //to debug message
console.warn('console.warn'); //to print Warning
console.error('console.error'); //to print Error
console.table(["car", "fruits", "color"]);//to print data in table structure
console.assert('console.assert'); //to print Error
console.dir({"name":"test"});//to print object
console.dirxml({"name":"test"});//to print object as xml formate

To Print Error:- console.error('x=%d', x);

console.log("This is the outer level");
console.group();
console.log("Level 2");
console.group();
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd();
console.log("Back to level 2");
console.groupEnd();
console.log("Back to the outer level");

#14

console.log("your message here");

working for me.. i'm searching for this.. i used Firefox. here is my Script.

为我工作。我寻找这个. .我使用Firefox。这是我的脚本。

 $('document').ready(function() {
console.log('all images are loaded');
});

works in Firefox and Chrome.

适用于Firefox和Chrome。

#15

The simplest way to do this is:

最简单的方法是:

console.warn("Text to print on console");

#16

With es6 syntax you can use:

使用es6语法，您可以使用:

console.log(`x = ${x}`);

#17

To answer your question you can use ES6 features,

要回答你的问题，你可以使用ES6特性，

var var=10;
console.log(`var=${var}`);

#18

This does not print to the Console, but will open you an alert Popup with your message which might be useful for some debugging:

这不会打印到控制台，但是会为您打开一个提示弹出，其中包含您的消息，这可能对一些调试有用:

just do:

只做:

alert("message");