javascript的console命令
1.分类输出
console.log('文字信息');
console.info('提示信息');
console.warn('警告信息');
console.error('错误信息');

2.分组输出
console.group('');
console.log("1-1");
console.log("1-2");
console.groupEnd();
console.group('');
console.log("2-1");
console.log("2-2");
console.groupEnd();

生成折叠的分组
console.groupCollapsed('');
console.log("1-1");
console.log("1-2");
console.groupEnd();
console.groupCollapsed('');
console.log("2-1");
console.log("2-2");
console.groupEnd();

嵌套
console.group('');
console.group("1-1");
console.group("1-1-1");
console.log('内容');
console.groupEnd();
console.groupEnd();
console.group("1-2");
console.log('内容');
console.log('内容');
console.groupEnd();
console.groupEnd();
console.groupCollapsed('');
console.group("2-1");
console.log('内容');
console.groupEnd();
console.group("2-2");
console.groupEnd();
console.groupEnd();

3.表格输出
console.table()将传入的对象,或数组以表格形式输出
var Obj = {
Obj1: {
a: "a1",
b: "b1",
c: "c1"
},
Obj2: {
a: "a2",
b: "b2",
c: "c2"
},
Obj3: {
a: "a3",
b: "b3",
c: "c3"
}
}
console.table(Obj);

var Arr = [
["a1","b1","c1"],
["a2","b2","c2"],
["a3","b3","c3"],
]
console.table(Arr);

4.查看对象
显示一个对象的所有属性和方法Console.dir()和Console.log()相同
var ss = {
name: 'AA',
title: 'title1',
}
console.log("console.dir(ss)");
console.dir(ss);
console.log("console.log(ss)");
console.log(ss);

5.查看节点
Console.dirxml()显示一个对象的所有属性和方法
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Flowchart</title>
<meta charset="UTF-8">
</head>
<body>
<div id="sample">
<div style="width: 100%; display: flex; justify-content: space-between">
<div id="myPaletteDiv" style="width: 150px; margin-right: 2px; background-color: whitesmoke; border: solid 1px black"></div>
<div id="myDiagramDiv" style="flex-grow: 1; height: 720px; border: solid 1px black"></div>
</div>
</div>
</body>
</html>
<script>
console.log("console.dirxml");
console.dirxml(document.getElementById("sample"));
console.log("console.log");
console.log(document.getElementById("sample"));
</script>

6.条件输出
- 当第一个参数或返回值为真时,不输出内容
- 当第一个参数或返回值为假时,输出后面的内容并抛出异常
console.assert(true, "see");
console.assert((function() { return true;})(), "see");
console.assert(false, "not see");
console.assert((function() { return false;})(), "not see");

7.记次输出
输出内容和被调用的次数
(function () {
for(var i = ; i < ; i++){
console.count("运行次数:");
}
})()

8.追踪调用堆栈
function add(a, b) {
console.trace("Add");
return a + b;
}
function add2(a, b) {
return add1(a, b);
}
function add1(a, b) {
return add(a, b);
}
var x = add2(, );

9.计时
Console.time()中的参数作为计时器的标识,具有唯一性Console.timeEnd()中的参数来结束此标识的计时器,并以毫秒为单位返回运行时间- 最多同时运行10000个计时器
console.time("Chrome中循环1000次的时间");
for(var i = ; i < ; i++)
{
}
console.timeEnd("Chrome中循环1000次的时间");

javascript的console命令的更多相关文章
- 9 个让 JavaScript 调试更简单的 Console 命令
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- Chrome console命令整理
console.dir (这个方法是我经常使用的 可不知道比for in方便了多少) 直接将该DOM结点以DOM树的结构进行输出,可以详细查对象的方法发展等等 在页面右击选择 审查元素 ,然后在弹出来 ...
- [转]九个Console命令,让js调试更简单
转自:九个Console命令,让js调试更简单 一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html ...
- js调试工具Console命令详解
这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下 一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...
- javascript调试 console
Console命令详解,让调试js代码变得更简单 Firebug是网页开发的利器,能够极大地提升工作效率. 但是,它不太容易上手.我曾经翻译过一篇<Firebug入门指南>,介绍了一些 ...
- 九个Console命令,让 JS 调试更简单
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- 9个Console命令
九个Console命令,让js调试更简单 By.cllgeek 一.显示信息的命令 1: <!DOCTYPE html> 2: <html> 3: <head> 4 ...
- 【F12】九个Console命令,让js调试更简单
一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html> <head> &l ...
- js调试工具Console命令详解——转
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
随机推荐
- 使用EGit插件将Eclipse现有项目分享到git@osc
. . . . . 程序员一定要养成使用版本管理工具的好习惯,即使是自己一个人开发的项目也要加入到版本管理工具中.使用版本管理工具主要有两个好处:一个是更好的管理多个副本,这个优势不用说了:另一个就是 ...
- JD 题目1040:Prime Number (筛法求素数)
OJ题目:click here~~ 题目分析:输出第k个素数 贴这么简单的题目,目的不清纯 用筛法求素数的基本思想是:把从1開始的.某一范围内的正整数从小到大顺序排列, 1不是素数,首先把它筛掉.剩下 ...
- Maven项目编译后classes文件中没有.xml问题
在做spring+mybatiss时,自动扫描都配置正确了,却在运行时出现了如下错误.后来查看target/classes/.../dao/文件夹下,发现只有mapper的class文件,而没有xml ...
- Android——开机启动功能(Service和BroadcastReceiver)
BroadcastReceiver(广播接收器):发出广播让服务器去接收 BootReceiver.java package com.example.chenshuai.test321; import ...
- (转)CDH中启动的hive,使用jdbc连接hiveServer2时候权限不足解决方案
Hive JDBC:java.lang.RuntimeException: org.apache.hadoop.ipc.RemoteException(org.apache.hadoop.securi ...
- 红楼梦人物关系图,一代大师成绝响,下回分解待何人,kindle读书摘要
人物关系图: https://www.cnblogs.com/images/cnblogs_com/elesos/1120632/o_2033091006.jpg 红楼梦 (古典名著普及文库) ( ...
- webpack7--css压缩成单独的css文件
先看下下面的图片: 我们可以看到,通过Webpack打包后,默认CSS是通过 内部样式表 写入的.我们如何把压缩后的CSS单独导出为CSS 呢? 1.安装 extract-text-webpack-p ...
- linux c 检测网络状态
转自:http://stackoverflow.com/questions/808560/how-to-detect-the-physical-connected-state-of-a-network ...
- 自然语言交流系统 phxnet团队 创新实训 项目博客 (十二)
关于情感词典的学习总结: 情感倾向可认为是主体对某一客体主观存在的内心喜恶,内在评价的一种倾向.它由两个方面来衡量:一个情感倾向方向,一个是情感倾向度. 情感倾向方向也称为情感极性.在微博中,可以理解 ...
- 关于Unity中的旋涡特效的制作(捕鱼达人3技术)(专题八)
Mesh--材质--Shader 1: Mesh 是网格,包括顶点,法线,纹理坐标,切线,三角形.在每一个3D模型节点里面,有一个Mesh Filter组件来提取模型里面的网格数据;2: Shader ...