6、monitor & unmonitor
monitor(function)，它接受四个函数名作为参数，比如function a,每次a被实施了，都会在支配台出口一条音信，里面含有了函数的名号a及施行时所盛传的参数。
而unmonitor(function)就是用来终止这一监听。
看了那张图，应该领会了，也正是说在monitor和unmonitor中间的代码，实践的时候会在决定台出口一条消息，里面包括了函数的名号a及进行时所传颂的参数。当撤除监视（也正是施行unmonitor时）就不再在决定台出口消息了。
JavaScript
$ // 简单明了就是 document.querySelector 而已。 $$ // 老妪能解正是document.querySelectorAll 而已。 $_ // 是上贰个表明式的值 $0-$4 //
是多年来5个Elements面板选中的DOM元素，待会会讲。 dir // 其实就是console.dir keys // 取对象的键名, 重返键名组成的数组 values //
去对象的值, 重回值组成的数组
|
1
2
3
4
5
6
7
|
$ // 简单理解就是 document.querySelector 而已。
$$ // 简单理解就是 document.querySelectorAll 而已。
$_ // 是上一个表达式的值
$0-$4 // 是最近5个Elements面板选中的DOM元素，待会会讲。
dir // 其实就是 console.dir
keys // 取对象的键名, 返回键名组成的数组
values // 去对象的值, 返回值组成的数组
|
下边看一下console.log的有的本事
1、重写console.log 退换输出文字的样式
2、利用控制台出口图片
3、钦命输出文字的体制
终极说一下chrome调节台二个简练的操作，怎么着查看页面元素，看下图就清楚了
你在支配台轻巧操作一次就驾驭了，是否以为异常的粗略！
赞 6 收藏
评论
Chrome 控制台console的用法
2015/01/12 · JavaScript
· Chrome
原稿出处：
ctriphire
世家都有用过各体系型的浏览器，每一种浏览器都有温馨的表征，本身拙见，在自身用过的浏览器在那之中，笔者是最爱怜Chrome的，因为它对于调节和测验脚本及前端设计调节和测试皆有它比另外浏览器有过之而无不比的地点。大概我们对console.log会有确定的刺探，心里难免会想调节和测量试验的时候用alert不就行了，干嘛还要用console.log这么一长串的字符串来代替alert输出消息呢，上边作者就介绍部分调和的入门本事，让您爱上console.log
先的简介一下chrome的调控台，张开chrome浏览器，按f12就足以轻便的开采调整台
世家能够看出调节台里面有一首诗还恐怕有别的消息，假如想清中央空调控台，能够点击左上角那么些
来清空，当然也得以透过在决定台输入console.clear()来贯彻清中央空调节台信息。如下图所示
近日一经三个情景，如若一个数组里面有比非常多的成分，但是你想驾驭各类成分具体的值，那时候想想假如您用alert那将是多惨的一件业务，因为alert阻断线程运维，你不点击alert框的规定开关下贰个alert就不会产出。
上面大家用console.log来替换，感受一下它的魅力。
看了地方那张图，是或不是认知到log的庞大之处了，上面大家来探视console里面具体提供了怎样措施可以供大家平时调节和测量检验时行使。
脚下调整台方法和本性有：
JavaScript
["$$", "$x", "dir", "dirxml",
"keys", "values", "profile",
"profileEnd", "monitorEvents",
"unmonitorEvents", "inspect", "copy",
"clear", "getEventListeners", "undebug",
"monitor", "unmonitor", "table",
"$0", "$1", "$2", "$3",
"$4", "$_"]
|
1
|
["$$", "$x", "dir", "dirxml", "keys", "values", "profile", "profileEnd", "monitorEvents", "unmonitorEvents", "inspect", "copy", "clear", "getEventListeners", "undebug", "monitor", "unmonitor", "table", "$0", "$1", "$2", "$3", "$4", "$_"]
|
下边大家来所有人家介绍一下梯次艺术首要的用途。
貌似情状下大家用来输入消息的法子首假如用到如下三个
1、console.log 用于出口普通音信
2、console.info 用以出口提醒性音信
3、console.error用来出口错误音信
4、console.warn用于出口警示消息
5、console.debug用来出口调节和测量试验信息
用图来说话
console对象的方面5种办法，都得以利用printf风格的占位符。可是，占位符的品类相当少，只扶助字符（%s）、整数（%d或%i）、浮点数（%f）和目的（%o）七种。
JavaScript
console.log(“%d年%d月%d日”,二〇一一,3,26);
console.log(“圆周率是%f”,3.1415926);
|
1
2
|
console.log("%d年%d月%d日",2011,3,26);
console.log("圆周率是%f",3.1415926);
|
%o占位符，能够用来查看三个目的内部景观
JavaScript
var dog = {}; dog.name = “大毛”; dog.color = “黄色”; console.log(“%o”,
dog);
|
1
2
3
4
|
var dog = {};
dog.name = "大毛";
dog.color = "黄色";
console.log("%o", dog);
|
6、console.dirxml用来显示网页的某些节点（node）所满含的html/xml代码**
JavaScript
<body> <table id=”mytable”> <tr>
<td>A</td> <td>A</td> <td>A</td>
</tr> <tr> <td>bbb</td> <td>aaa</td>
<td>ccc</td> </tr> <tr> <td>111</td>
<td>333</td> <td>222</td> </tr>
</table> </body> <script type=”text/javascript”>
window.onload = function () { var mytable =
document.getElementById(‘mytable’); console.dirxml(mytable); }
</script>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<body>
<table id="mytable">
<tr>
<td>A</td>
<td>A</td>
<td>A</td>
</tr>
<tr>
<td>bbb</td>
<td>aaa</td>
<td>ccc</td>
</tr>
<tr>
<td>111</td>
<td>333</td>
<td>222</td>
</tr>
</table>
</body>
<script type="text/javascript">
window.onload = function () {
var mytable = document.getElementById(‘mytable’);
console.dirxml(mytable);
}
</script>
|
7、console.group出口一组新闻的伊始
8、console.groupEnd得了一组输出音讯
看你要求选用不一样的出口方法来采纳，如若上述八个方法再同盟group和groupEnd方法来一起利用就足以输入有滋有味的不如方式的输出信息。
哈哈哈，是或不是认为很神奇啊！
9、console.assert对输入的表达式实行预感，唯有表明式为false时，才输出相应的音信到调整台
10、console.count（那么些方法十一分实用哦）当您想总括代码被实行的次数
11、console.dir(这些措施是自己不时应用的 可不知道比for
in方便了稍稍) 直接将该DOM结点以DOM树的布局举办输出，能够详细查对象的措施升高级等
12、console.time 计时起来
13、console.timeEnd 计时截止（看了上面包车型客车图你须臾间就感受到它的决定了）
14、console.profile和console.profileEnd合作共同利用来查阅CPU使用有关音讯
在Profiles面板里面查看就能够见到cpu相关应用新闻
15、console.timeLine和console.timeLineEnd协作共同记录一段时间轴
16、console.trace 货仓跟踪相关的调整
上述格局只是自身个人掌握罢了。假若想查看具体API，能够上合法看看，具体地址为：
上面介绍一下调节台的部分快速键
1、方向键盘的上下键，咱们一用就清楚。举个例子用上键就也便是选拔上次在调节台的输入符号
2、$_一声令下归来方今一回表明式实行的结果，作用跟按进步的方向键再回车是平等的
上面的$_亟待通晓其奥义手艺选择合适，而$0~$4则表示了近年5个你挑选过的DOM节点。
怎样意思？在页面右击选择审查元素，然后在弹出来的DOM结点树上边随意点选，那个被点过的节点会被记录下来，而$0会回到前段时间叁遍点选的DOM结点，依此类推，$1重回的是极品次点选的DOM节点，最多保留了5个，若是远远不够5个，则赶回undefined。
3、Chrome
调整新竹原生支持类jQuery的选拔器，也便是说你能够用$丰硕熟知的css选择器来抉择DOM节点
4、copy通过此命令能够将在调节台获取到的剧情复制到剪贴板
（哈哈 刚刚从调控台复制的body里面包车型大巴html能够Infiniti制粘贴到哪 例如记事本
是或不是感到成效很庞大）
5、keys和values 前面一个再次来到传入对象具备属性名组成的数量，前者重回全数属性值组成的数组
谈到那，不免想起console.table方法了
提及底说一下chrome调整台七个轻便的操作，怎么着查看页面成分，看下图就通晓了
console对象的下面5种艺术，都得以动用printf风格的占位符。不过，占位符的档期的顺序比很少，只帮助字符（%s）、整数（%d或%i）、浮点数（%f）和目标（%o）三种。
console.log(“%d年%d月%d日”,二零一一,3,26);console.log(“圆周率是%f”,3.1415926);
（哈哈 刚刚从调节台复制的body里面包车型客车html能够任意粘贴到哪, 举个例子记事本,
是否以为功效很有力）
5、keys和values前端再次来到传入对象具备属性名组成的数目，后面一个再次来到全体属性值组成的数组
当今假如二个气象，假若二个数组里面有大多的因素，然而你想理解各类成分具体的值，那时候想想借使您用alert那将是多惨的一件事情，因为alert阻断线程运维，你不点击alert框的规定开关下二个alert就不会产出。
上边大家用console.log来替换，感受一下它的吸动力。
14、console.profile和console.profileEnd协作协同行使来查阅CPU使用相关音信
3、钦定输出文字的体制
15、console.timeLine和console.timeLineEnd相称协同记录一段时间轴
16、console.trace 酒店追踪相关的调护医疗
上述办法只是本人个人知道罢了。假如想查看具体API，能够上合法看看，具体地址为：https://developer.chrome.com/devtools/docs/console-api
调整台的一对连忙键
1、方向键盘的上下键，大家一用就通晓。比方用上键就一定于接纳上次在调控台的输入符号
2、$_命令归来近年来二遍表明式试行的结果，效率跟按进步的方向键再回车是大同小异的
4、copy因此此命令能够就要调节台获取到的原委复制到剪贴板
6、monitor & unmonitor
monitor(function)，它接受一个函数名作为参数，举例function a
,每次a
被实践了，都会在支配台出口一条新闻，里面含有了函数的名称a
及举行时所传颂的参数。
而unmonitor(function)就是用来终止这一监听。
看了那张图，应该驾驭了，也正是说在monitor和unmonitor中间的代码，试行的时候会在调节台出口一条音信，里面饱含了函数的名称a
及试行时所传诵的参数。当免除监视（也便是执行unmonitor时）就不再在支配台出口音信了。
$ // 轻巧精通便是 document.querySelector 而已。
$$ // 老妪能解就是 document.querySelectorAll 而已。
$_ // 是上一个表明式的值
0−
4 // 是近来5个Elements面板选中的DOM成分，待会会讲。
dir // 其实正是 console.dir
keys // 取对象的键名, 再次回到键名组成的数组
values // 去对象的值, 再次回到值组成的数组
6、console.dirxml用来体现网页的某些节点（node）所包括的html/xml代码****
<body> <table id=”mytable”> <tr>
<td>A</td> <td>A</td> <td>A</td>
</tr> <tr> <td>bbb</td> <td>aaa</td>
<td>ccc</td> </tr> <tr> <td>111</td>
<td>333</td> <td>222</td> </tr>
</table></body><script type=”text/javascript”>
window.onload = function () { var mytable =
document.getElementById(‘mytable’); console.dirxml(mytable);
}</script>
在Profiles面板里面查看就足以看出cpu相关应用音讯
世家能够见见调节台里面有一首诗还恐怕有任何消息，如若想清中央空调节台，能够点击左上角那一个
先的简便介绍一下chrome的调整台，张开chrome浏览器，按f12就足以轻便的开荒调整台
上面看一下console.log的部分本领
1、重写console.log 退换输出文字的体裁
12、console.time 计时早先
13、console.timeEnd
计时截止（看了下边的图你弹指间就感受到它的决定了）
上面的$_
亟待通晓其奥义才能动用方便，而0
4则表示了这两天5个你挑选过的DOM节点。
怎样意思？在页面右击选用考察成分
，然后在弹出来的DOM结点树下面随意点选，那么些被点过的节点会被记录下来，而$0
会重回目前叁回点选的DOM结点，就那样类推，$1重回的是极品次点选的DOM节点，最多保留了5个，假诺远远不足5个，则重回undefined
。
正文转自Chrome
控制台console的用法
2、利用调整台出口图片