JavaScript 打印到浏览器的调试控制台

  • Z时代
  • 2024-01-10
  • 分类：综合

示例

可以使用浏览器的调试控制台来打印简单消息。可以在浏览器中直接打开此调试或Web控制台（F12大多数浏览器中的键-有关更多信息，请参见下面的备注），并且可以通过键入以下命令来调用Javascript对象的log方法console：

console.log('My message');

然后，按Enter，它将显示My message在调试控制台中。

console.log()可以使用当前范围内可用的任意数量的参数和变量来调用。多个参数将打印在一行中，并且它们之间的间隔很小。

var obj = { test: 1 };
console.log(['string'], 1, obj, window);

该log方法将在调试控制台中显示以下内容：

['string']  1  Object { test: 1 }  Window { /* truncated */ }

除了普通字符串，还可以处理其他类型，例如数组，对象，日期，函数等：console.log()

console.log([0, 3, 32, 'a string']);
console.log({ key1: 'value', key2: 'another value'});

显示：

Array [0, 3, 32, 'a string']
Object { key1: 'value', key2: 'another value'}

嵌套的对象可能会折叠：

console.log({ key1: 'val', key2: ['one', 'two'], key3: { a: 1, b: 2 } });

显示：

Object { key1: 'val', key2: Array[2], key3: Object }

某些类型（例如Dateobject和functions）的显示方式可能有所不同：

console.log(new Date(0));
console.log(function test(a, b) { return c; });

显示：

Wed Dec 31 1969 19:00:00 GMT-0500 (Eastern Standard Time)
function test(a, b) { return c; }

其他列印方式

除了该log方法外，现代浏览器还支持类似的方法：

  • console.info–小信息图标（。）出现在打印的string(s)或的左侧object(s)。

  • console.warn–左侧出现小警告图标（！）。在某些浏览器中，日志的背景为黄色。

  • console.error–小时间图标(times)出现在左侧。在某些浏览器中，日志的背景为红色。

  • console.timeStamp –输出当前时间和指定的字符串，但不标准：

    console.timeStamp('msg');

    显示：

    00:00:00.001 msg

  • console.trace–log如果在全局范围内调用，则输出当前堆栈跟踪或显示与方法相同的输出。

    function sec() {
       first();
    }
    function first() {
       console.trace();
    }
    sec();

    显示：

    first
    sec
    (anonymous function)

上图显示了timeStampChrome版本56中的所有功能，但除外。

这些方法的行为类似于该log方法，并且在不同的调试控制台中可能以不同的颜色或格式呈现。

在某些调试器中，可以通过单击打印的文本或引用相应对象属性的小三角形（►）来进一步扩展各个对象信息。这些折叠的对象属性可以在日志中打开或关闭。有关此console.dir的其他信息，请参见

以上是 JavaScript 打印到浏览器的调试控制台 的全部内容， 来源链接： utcz.com/z/315782.html

回到顶部