总结：关于console的一些用法

最新推荐文章于 2023-06-21 09:52:57 发布

趁早--我是认真的

最新推荐文章于 2023-06-21 09:52:57 发布

阅读量468

点赞数

分类专栏： Javascript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/Mark_JF00/article/details/60965646

版权

Javascript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1、console.log() //控制台日志

我们可以从控制台中看到，console.log中的结果，相比alert,console.log不会阻断线程运行，不需要像alert要点击确定取消才能运行后面的程序

2、console.dir() console.dirxml()

在调试JavaScript程序时，有时需要dump某些对象的详细信息。通过手工编写JavaScript代码可以完成这一工作：针对对象的属性进行循环，将循环到的每一个属性值打印出来；可见，这一过程是比较繁琐的。在具备调试工具的浏览器上，这一工作可以通过console.dir()语句来方便的完成。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="application/javascript">

var cat = {};
cat.name = '咪咪';
cat.color = '白色';
cat.show = function(){
	return '喵喵';
};

console.dir(cat);  //输出所有信息

window.onload = function(){
	var oDiv = document.getElementById('div1');
	
	console.dirxml(oDiv); //显示当前元素的代码结构
	
};

</script>
</head>

<body>
<div id="div1">
	<span>一只小猫</span>
</div>
</body>
</html>

通过使用console.dir()，新建的cat对象信息“div1” 被dump出来了。在Firebug控制台中其显示结果为：

3、console.assert() //断言

var a = 0;
console.assert(a);//假即断言失败
console.assert(20 === '20');//假即断言失败

4、console.trace() //追踪跟踪
调试JavaScript程序时，有时需要打印函数调用的栈信息，这可以通过使用console.trace()来实现。以下面的代码为例：

<script>

function a(){

	return b();
}

function b(){
	return c();
}

function c(){
	console.trace();//追踪跟踪探索
	return 1;
}

a();

</script>

后台结果如图;

5、console.time() //计时

<script type="application/javascript">

    console.time('计时器');//方法允许开发者在任意代码中使用, 显示的结果是中间持续的运行时间, 以毫秒为单位.

    for(var i=0;i<1000000;i++){
    }

    console.timeEnd('计时器');//结果 3.19ms

</script>