chrome console.log API
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的更多相关文章
- Chrome & console.log & color & js
Chrome & console.log & color & js console.log & color // OK log(`%cchat_list =\n%c${ ...
- chrome console.log失效
把红框里的内容去掉就可以了 那个框是过滤..
- console.log()显示图片以及为文字加样式
有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...
- 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 ...
- Getting console.log output with Selenium Python API bindings
持久化存储 Getting console.log output from Chrome with Selenium Python API bindings - Stack Overflow http ...
- Chrome console & Command Line API
Chrome console & Command Line API $ && $$ querySelector querySelectorAll Command Line AP ...
- 小谈chrome调试命令:console.log的使用
相信从事前端开发的您,一定不会陌生Mozilla五星级推荐的一款插件:firebug,它是如此强大,乃至于我们可以很方便地调试DHTML的近乎所有元素.而在它深邃的机体里,还存有一个命令:consol ...
- 网页console console.log 用法 Chrome F12
#########sample 0 https://www.cnblogs.com/xiaozong/p/4961929.html https://blog.csdn.net/shanliangliu ...
- 实验吧-密码学-js(Chrome用console.log调试js)
题目就是js,可能就是一个js的代码,查看源码并复制,在Chrome中打开网页,审查元素. 将复制的代码输入,将eval改成console.log,再回车执行,就得到一段js代码. 代码中有Unico ...
随机推荐
- C#解析 json格式
C# 解析 json JSON(全称为JavaScript Object Notation) 是一种轻量级的数据交换格式.它是基于JavaScript语法标准的一个子集. JSON采用完全独立于语言的 ...
- 关于一些Spring MVC控制器的参数注解总结
昨天同事问我控制器参数的注解的问题,我好久没那样写过,把参数和url一起设置,不过,今天我看了一些文章,查了一些资料,我尽可能的用我自己的理解方式来解释它吧! 1.@RequestParam绑定单个请 ...
- Firefox火狐广告过滤插件Adblock Plus过滤规则包[中文维护小组]
如果你经常使用Firefox火狐浏览器那么一定知道Adblock Plus这款广告过滤插件,功能非常强大,但是Adblock Plus广告过滤插件自带的过滤规则并不多,而且也不太适合我们中国的网站,在 ...
- 厌食?暴食?试试这个 VR 新疗法
今日导读 “我知道我要吃饭,但我真的什么都吃不下.” “我脑子里想的只有吃东西,吃吃吃!” ....... 作为一个正常人,我们完全无法想象患厌食症或贪食症人群所受的痛苦.长期的厌食,会使一个人瘦的只 ...
- Python2 和Python3 的区别
print Python 2中的print语句被Python 3中的print()函数取代,这意味着在Python 3中必须用括号将需要输出的对象括起来. 在Python 2中使用额外的括号也是可以的 ...
- HTML5<header>元素
HTML5<header>元素 1.header元素描述了文档的头部区域,主要用于定义内容的介绍展示区域. 2.实例: <header> <h2>heder元素描述 ...
- 01_3Java Application初步
01_3Java Application初步 l Java源文件以“java”为扩展名.源文件的基本组成部分是类(class),如本例中的HelloWorld类. l 一个源文件中最多只有一个publ ...
- 理解JWT的使用场景和优劣
理解JWT的使用场景和优劣 淘楼小能手 百家号04-2816:20 经过前面两篇文章<JSON Web Token - 在Web应用间安全地传递信息><八幅漫画理解使用JSON We ...
- Jenkins注意点
这里要填写 在 Linux 上 生成的 git 私钥 并且带上 前后 注释 ------start ----- ---end -------
- 地理位置编码geohash学习笔记
1.geohash及其性质 一种空间索引技术. (1)将二维的经纬度位置数据转换为一维的字符串(基本上hash族的算法都是这样): 其优点在于hash编码后的字符串,可以方便查找和索引,从而减少相似计 ...