简单的浏览器调试——console命令
一、显示信息
<script type="text/javascript">
console.log('hello');
console.info('信息');
console.error('错误');
console.warn('警告');
</script>
二、占位符
<script type="text/javascript">
console.log("%d年%d月%d日",2016,11,12);
</script>
三、信息分组
<script type="text/javascript">
console.group("我是第一组"); console.log("111"); console.groupEnd(); console.group("我是第二组"); console.log("222"); console.groupEnd();
</script>
四、查看对象信息
<script type="text/javascript">
var obj = {
name:"张三",
group:001,
course:"计算机"
};
console.dir(obj);
</script>
五、显示节点内容(包括html/xml)
<div id="obj">
<p>www.baidu.com</p>
</div>
<script type="text/javascript">
var info = document.getElementById('obj');
console.dirxml(obj);
</script>
六、判断变量是否为真
<script type="text/javascript">
var result = 0;
console.assert( result );
var year = 2016;
console.assert(year == 2018 );
</script>
七、追踪函数的调用轨迹
<script type="text/javascript">
function foo(a,b){
console.trace();
return a+b;
}
var x = foo3(1,1);
function foo3(a,b){return foo2(a,b);}
function foo2(a,b){return foo1(a,b);}
function foo1(a,b){return foo(a,b);}
</script>
八、计时功能
<script type="text/javascript">
console.time("计时器01");
for(var i=0;i<999;i++){
for(var j=0;j<999;j++){}
}
console.timeEnd("计时器01");
</script>
九、程序性能分析
<script type="text/javascript">
function getAll(){
alert("hello");
for(var i=0;i<10;i++){
funcA(1000);
}
funcB(10000);
} function funcA(count){
for(var i=0;i<count;i++){}
} function funcB(count){
for(var i=0;i<count;i++){}
} console.profile('性能分析');
getAll();
console.profileEnd();
</script>
浏览器调试新技能,学习之余写到这里备忘~
简单的浏览器调试——console命令的更多相关文章
- 【F12】Console命令,让js调试更简单
Console命令,让js调试更简单 一.显示信息的命令 console.log("normal"); // 用于输出普通信息 console.info("informa ...
- [转]九个Console命令,让js调试更简单
转自:九个Console命令,让js调试更简单 一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html ...
- Console命令详解,让调试js代码变得更简单
Firebug是网页开发的利器,能够极大地提升工作效率. 但是,它不太容易上手.我曾经翻译过一篇<Firebug入门指南>,介绍了一些基本用法.今天,继续介绍它的高级用法. ======= ...
- [转] Console命令详解,让调试js代码变得更简单
http://www.cnblogs.com/see7di/archive/2011/11/21/2257442.html Firebug是网页开发的利器,能够极大地提升工作效率. 但是,它不太容易上 ...
- 9 个让 JavaScript 调试更简单的 Console 命令
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- 九个Console命令,让 JS 调试更简单
一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...
- 【F12】九个Console命令,让js调试更简单
一.显示信息的命令 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <!DOCTYPE html> <html> <head> &l ...
- 尝试在你浏览器的Console(F12)中运行一下,你会发现页面被不同的颜色块高亮了(css调试中学到的js)
现在到处都是JavaScript,每天都能知道点新东西.一旦你入了门,你总能从这里或是那里领悟到很多知识. 一旦我发现一些有意思的东西,我喜欢去感觉他们的源代码,看一看它是怎么办到的. 今天我想分享A ...
- 使用Console命令调试JS
一.console 的对象常用的方法 1.console.log(object[, object, ...])使用频率最高的一条语句:向控制台输出一条消息.支持 C 语言 printf 式的格式化输出 ...
随机推荐
- 利用Python进行数据分析(15) pandas基础: 字符串操作
字符串对象方法 split()方法拆分字符串: strip()方法去掉空白符和换行符: split()结合strip()使用: "+"符号可以将多个字符串连接起来: join( ...
- 怎样写一个webpack loader
div{display:table-cell;vertical-align:middle}#crayon-theme-info .content *{float:left}#crayon-theme- ...
- parseInt实例详解
parseInt() 函数可解析一个字符串,并返回一个整数. parseInt(string, radix) 参数 描述 string 必需.要被解析的字符串. radix 可选.表示要解析的数字的基 ...
- DataGrid 列头实现国际化语言切换
<DataGrid> <DataGrid.Columns> <DataGridTextColumn Binding="{x:Null}" Width= ...
- 居然是Firefox没有抛弃我们
面向企业级市场,一款网页浏览器的很多特性不是说改就改,说丢弃就丢弃.就像微软不能抛弃IE一样,Firefox也有类似的定位和使命. Firefox即尝试提供企业级市场所需的特性稳定的软件版本(LTS) ...
- PHP基础知识第一趴
今天来贴一贴我的一张部分php基础知识的思维导图.未完,待续......慢慢'补枪'(为了让引号内的期望输出内容<strong>变成</strong>现实,应该使用双引号?那就 ...
- Delphi_07_Delphi_Object_Pascal_基本语法_05_函数参数
这里主要讨论Delphi中函数.方法的相关内容. 一.工程文件 { Delphi语法方法和函数 1.方法 2.函数 } program Routine; {$APPTYPE CONSOLE} uses ...
- java反射复制属性值
/** 将sourceObj的属性拷贝到targetObj * @param sourceObj * @param targetObj * @param clazz 从哪一个类开始(比如sourceO ...
- 【大前端之打通账号系统】passport应该如何落地?
前言 之前接入百度账号系统的时候写了一篇博客做研究:[大前端]认识单点登录,出来后才发现,很多小公司其实并没有将账号系统打通,总结一下账号系统没通的原因是: ① 最初设计就没想过身份认证应该做整合 ② ...
- Why AlloyFinger is so much smaller than hammerjs?
AlloyFinger is the mobile web gesture solution at present inside my company, major projects are in u ...