console.log(object [, object, ...])

Displays a message in the console. You pass one or more objects to this method, each of which are evaluated and concatenated into a space-delimited string. The first parameter you pass to log() may contain format specifiers, a string token composed of the percent sign (%) followed by a letter that indicates the formatting to be applied.

Dev Tools supports the following format specifiers:

Format Specifier Description
%s Formats the value as a string.
%d or %i Formats the value as an integer.
%f Formats the value as a floating point value.
%o Formats the value as an expandable DOM element (as in the Elements panel).
%O Formats the value as an expandable JavaScript object.
%c Formats the output string according to CSS styles you provide.

Basic example:

console.log("App started");

An example that uses string (%s) and integer (%d) format specifiers to insert the values contained by the variables userName and userPoints:

console.log("User %s has %d points", userName, userPoints);

An example of using the element formatter (%o) and object formatter (%O) on the same DOM element:

console.log("%o, %O", document.body, document.body);

The following example uses the %c format specifier to colorize the output string:

console.log("%cUser %s has %d points", "color:orange; background:blue; font-size: 16pt", userName, userPoints);

console.profile([label])

When the Chrome DevTools is open, calling this function starts a JavaScript CPU profile with an optional label.To complete the profile, call console.profileEnd(). Each profile is added to the Profiles tab.

In the following example a CPU profile is started at the entry to a function that is suspected to consume excessive CPU resources, and ended when the function exits.

function processPixels() {  console.profile("Processing pixels");  // later, after processing pixels  console.profileEnd();}

console.profileEnd()

Stops the current JavaScript CPU profiling session, if one is in progress, and prints the report to the Profiles panel.

console.profileEnd()

See console.profile() for example use.

console.time(label)

Starts a new timer with an associated label. When console.timeEnd() is called with the same label, the timer is stopped the elapsed time displayed in the Console. Timer values are accurate to the sub-millisecond.

console.time("Array initialize");var array= new Array(1000000);for (var i = array.length - 1; i >= 0; i--) {    array[i] = new Object();};console.timeEnd("Array initialize");

Note: The string you pass to the time() and timeEnd() methods must match for the timer to finish as expected.

console.timeEnd(label)

Stops the timer with the specified label and prints the elapsed time.

For example usage, see console.time().

console.timeStamp([label])

This method adds an event to the Timeline during a recording session. This lets you visually correlate your code generated time stamp to other events, such as screen layout and paints, that are automatically added to the Timeline.

See Marking the Timeline for an example of using console.timeStamp().

console.trace(object)

Prints a stack trace from the point where the method was called, including links to the specific lines in the JavaScript source. A counter indicates the number of times that trace() method was invoked at that point, as shown in the screen shot below.

It is also possible to pass in arguments to trace(). For example:

console.warn(object [, object, ...])

This method is like console.log() but also displays a yellow warning icon along with the logged message.

console.warn("User limit reached! (%d)", userPoints);

debugger

The global debugger function causes Chrome to stop program execution and start a debugging session at the line where it was called. It is equivalent to setting a "manual" breakpoint in the Sources tab of Chrome DevTools.

Note: The debugger command is not a method of the console object.

In the following example the JavaScript debugger is opened when an object's brightness() function is invoked:

brightness : function() {    debugger;    var r = Math.floor(this.red*255);    var g = Math.floor(this.green*255);    var b = Math.floor(this.blue*255);    return (r * 77 + g * 150 + b * 29) >> 8;}

chrome console.log API的更多相关文章

  1. Chrome & console.log & color & js

    Chrome & console.log & color & js console.log & color // OK log(`%cchat_list =\n%c${ ...

  2. chrome console.log失效

    把红框里的内容去掉就可以了 那个框是过滤..

  3. console.log()显示图片以及为文字加样式

    有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...

  4. js console.log color all in one

    js console.log color all in one console.log color Chrome console.log 语法 / grammar %c, %s, css style ...

  5. Getting console.log output with Selenium Python API bindings

    持久化存储 Getting console.log output from Chrome with Selenium Python API bindings - Stack Overflow http ...

  6. Chrome console & Command Line API

    Chrome console & Command Line API $ && $$ querySelector querySelectorAll Command Line AP ...

  7. 小谈chrome调试命令:console.log的使用

    相信从事前端开发的您,一定不会陌生Mozilla五星级推荐的一款插件:firebug,它是如此强大,乃至于我们可以很方便地调试DHTML的近乎所有元素.而在它深邃的机体里,还存有一个命令:consol ...

  8. 网页console console.log 用法 Chrome F12

    #########sample 0 https://www.cnblogs.com/xiaozong/p/4961929.html https://blog.csdn.net/shanliangliu ...

  9. 实验吧-密码学-js(Chrome用console.log调试js)

    题目就是js,可能就是一个js的代码,查看源码并复制,在Chrome中打开网页,审查元素. 将复制的代码输入,将eval改成console.log,再回车执行,就得到一段js代码. 代码中有Unico ...

随机推荐

  1. Python2和Python3语法区别

    1.使用for循环进行换行 python 2.x, print 不换行>>> print x, python 3.x print 不换行>>> print(x, e ...

  2. 使用控件的Tag属性传递信息

    实现效果: 知识运用: Control类的Tag属性 //获取或设置包含 有关控件的数据的对象 public object Tag {get;set;} 实现代码: private void Form ...

  3. npm模块安装机制简介

    npm是node的模块管理器,功能及其强大,它是node获得成功的重要原因之一. 正因为有了nom,我们只要一行命令,就能安装别人写好的模块. $ npm install 本文介绍npm模块安装机制的 ...

  4. 2018.4.1 Ubuntu16.04 下配置Tomcat服务器以及设置dingshi启动

    Tomcat自启动的设置技巧 以root用户登录系统: cd /etc/rc.d/init.d/ vi tomcat #!/bin/sh # # tomcat: Start/Stop/Restart ...

  5. C10 C语言数据结构

    目录 枚举 结构体 共用体 枚举 enum enum枚举是 C 语言中的一种基本数据类型,它可以让数据更简洁,更易读. 枚举语法定义格式为: enum 枚举名 {枚举元素1,枚举元素2,……}; 枚举 ...

  6. eclipse 中main()函数中的String[] args如何使用?通过String[] args验证账号密码的登录类?静态的主方法怎样才能调用非static的方法——通过生成对象?在类中制作一个方法——能够修改对象的属性值?

    eclipse 中main()函数中的String[] args如何使用? 右击你的项目,选择run as中选择 run configuration,选择arguments总的program argu ...

  7. cron job 里面,如何让脚本半分钟运行一次?

    cron job 里面,如何让脚本半分钟运行一次? cron本身实现不了.但可以借助于sleep命令实现. 解决方法: 两个脚本 一个正常,一个增加sleep 30 crontab设置同时启动 在有的 ...

  8. 35. Search Insert Position@python

    Given a sorted array and a target value, return the index if the target is found. If not, return the ...

  9. 【转】嵌入式操作系统VxWorks中TFFS文件系统的构建

    时间:2005-02-20 来源:21IC中国电子网 作者:771所加固机工程部 蔡本华 高文炜 关键字:VxWorks   TFFS   嵌入式操作系统   文件系统       摘要:目前的嵌入式 ...

  10. C++ string头文件

    转载自https://blog.csdn.net/superna666/article/details/52809007/ 作者 zhenzhenjiajia888 标准c++中string类函数介绍 ...