搜索
首页php教程php手册Console Api 让 JS 调试更简单、高效

除了console.log 你还知道其他调试方法吗?

所有Console Api <script><br /> console.dir(console);<br /> </script>显示简单信息<script><br /> console.log(&#039;hello world&#039;);<br /> console.info(&#039;信息&#039;);<br /> console.error(&#039;错误&#039;);<br /> console.warn(&#039;警告&#039;);<br /> </script>   占位符<script><br /> console.log(&#039;%d-%d-%d,%s&#039;,2016,08,21,&#039;中国女排夺的冠军!&#039;);<br /> </script>   统计代码执行次数<script><br /> function getInfo()<br /> {<br /> console.count(&#039;执行次数:&#039;);<br /> }<br /> getInfo();<br /> getInfo();<br /> getInfo();<br /> getInfo();<br /> </script>  显示分组信息<script><br /> console.group("第一组信息");<br /> console.log(&#039;第一组:自定义消息1&#039;);<br /> console.log(&#039;第一组:自定义消息2&#039;);<br /> console.log(&#039;第一组:自定义消息3&#039;);<br /> console.groupEnd();<br /> <br /> console.group("第二组信息");<br /> console.log(&#039;第二组:自定义消息1&#039;);<br /> console.log(&#039;第二组:自定义消息2&#039;);<br /> console.log(&#039;第二组:自定义消息3&#039;);<br /> console.groupEnd();<br /> </script>  显示对象信息<script><br /> var TomObj = {<br /> name : "Tom",<br /> sex : "男",<br /> age : &#039;31&#039;,<br /> hobby : "coding..."<br /> };<br /> console.dir(TomObj);<br /> </script>  显示页面信息<div> <br>     <h1 id="console-api">console api</h1> <br> </div> <br> <script><br /> var info = document.getElementById(&#039;console&#039;);<br /> console.dirxml(info);<br /> </script> 判断表达式或变量是否为真<script><br /> var code = 200;<br /> console.assert(code);<br /> console.assert(code == 200);<br /> console.assert(code == 500);<br /> </script>追踪函数的调用轨迹<script><br /> function add(a,b) {<br /> console.trace();<br /> return a + b;<br /> }<br /> <br /> add(1,2);<br /> add(2,3);<br /> add(3,4);<br /> </script>计时功能<script><br /> console.time("控制台计时器") ;<br /> console.log(&#039;Start&#039;);<br /> for(var i=0;i<1000;i++) {<br /> for(var j=0;j<1000;j++){<br /> }<br /> }<br /> console.log(&#039;End&#039;);<br /> console.timeEnd("控制台计时器");<br /> </script>    分析性能<script><br /> function getNews() {<br /> _getAjax_1();<br /> _getAjax_3();<br /> }<br /> <br /> function _getAjax_1 () {<br /> for(var i=0;i<10;i++){<br /> _getAjax_2();<br /> }<br /> }<br /> <br /> function _getAjax_2 () {<br /> for(var i=0;i<100;i++){<br /> _getAjax_3()<br /> }<br /> }<br /> <br /> function _getAjax_3 () {<br /> for(var i=0;i<1000;i++){<br /> }<br /> }<br /> console.profile(&#039;性能分析器&#039;);<br /> getNews();<br /> console.profileEnd();<br /> </script>  温馨提示:尝试用起来吧,让自己爱上控制台!

上传图片,总是失败,效果图,可以查看来源链接。

Thanks ~

来源:http://mp.weixin.qq.com/s?__biz=MjM5NDM4MDIwNw==&mid=2448834664&idx=1&sn=7c4acdacc74ed1db81703be60e5537b1#rd

更多【干货分享】,请关注我的个人订阅号。

Console Api 让 JS 调试更简单、高效

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

将Eclipse与SAP NetWeaver应用服务器集成。

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

Dreamweaver Mac版

Dreamweaver Mac版

视觉化网页开发工具