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. UI设计中蕴涵着系统重要的数据结构与功能设计

    UI设计中蕴涵着系统重要的数据结构与功能设计 UI设计中的用户需求,事件(用例)驱动

  2. IT圈网红,抢鲜围观

    即将于2017年10月23-26日,在北京举办的微软技术暨生态大会,是微软中国年度最盛大的科技峰会,是微软技术大会与合作伙伴大会的首次联袂,也是聚集众多IT大咖的技术狂欢派对. 无论你想实现现代化工作 ...

  3. 在Windows Server 2012中搭建SQL Server 2012故障转移集群

    OK~ WSFC 2012 R2 年度盛宴开始~ 在本文中,老王将用一系列的场景,把动态仲裁,动态见证,票数调整,LowerQuorumPriorityNodeID,阻止仲裁等群集仲裁技术串起来,完成 ...

  4. ThreadLocal的内存泄露

    ThreadLocal的目的就是为每一个使用ThreadLocal的线程都提供一个值,让该值和使用它的线程绑定,当然每一个线程都可以独立地改变它绑定的值.如果需要隔离多个线程之间的共享冲突,可以使用T ...

  5. jquery绑定事件的系统参数传递方法

    如果是传递的事件自带函数,,可使用以下语法(以鼠标移动事件为例): init: function () { $(document).on("mousemove",loginOper ...

  6. Android(java)学习笔记117:SharedPreferences(轻量级存储类)

    1.SharedPreferences是Android平台上一个轻量级的存储类,简单的说就是可以存储一些我们需要的变量信息.2个activity 之间的数据传递除了可以他通过intent来传递数据,还 ...

  7. GIT分布式版本控制器的前后今生

    Git的入门与安装 GIT基础操作 GIT的分支应用 GITLAB应用 gitlab与pycharm应用 GITHUB使用

  8. 影响一个UIView是否能正常显示的几个因素

    在使用代码实现UIView及其子类的对象的时候,经常会遇到创建的某个view没有显示在屏幕上.以下总结了本人遇到过的几种情况.可能还有些其它的原因也会导致view不能正常显示,限于个人经历有限,无法全 ...

  9. BCB:使用CppWebBrowser判断网页加载完成

    void __fastcall TForm1::CppWebBrowser1DocumentComplete(TObject *Sender, LPDISPATCH pDisp, Variant *U ...

  10. JavaScript -- DOM事件

    什么是事件 事件就是文档或浏览器窗口中发生的一些特定的交互瞬间.比如你在网页上见到的鼠标点击一个按钮,按钮的颜色发生了变化,就是因为这个标签绑定了点击事件 鼠标事件 onload:页面加载时触发 on ...