<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> var cat = {}; cat.name = "咪咪"; cat.color = "白色"; cat.show = function(){ return "喵~!" }; console.info(cat); </script> </head> <body> </body> </html>
会弹出对象的信息(name,color等),但是不完全这个时候值需要点击DOM按钮就可以看到cat的具体信息、还可以使用console.dir就可以显示出所有的信息
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> window.onload = function(){ var divO = document.getElementById("div1"); console.dirxml(divO); } </script> </head> <body> <div id="div1">testone</div> </body> </html>
会显示当前元素的代码结构
常用的函数语句
console.assert
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> var a = 0; console.assert(a); </script> </head> <body> </body> </html>
console.assert方法用于对一个表达式的执行结果进行评估,如果该表达式的执行结果为false,则输出一个消息字符串并抛出AssertionError异常。
console.trace():在控制台打印该处的函数调用栈信息
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> function a(){ return b(); } function b(){ return c() } function c(){ console.trace(); return 1; } a(); </script> </head> <body> </body> </html>
按照执行顺序依次打印 c() b() a(),能够清楚的知道当前函数的执行过程
console.time():打印当前代码的运行时间
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script> console.time('计时器'); for(var i= 0 ; i<1000000; i++){ } console.timeEnd('计时器'); </script> </head> <body> </body> </html>
输出当前页面的运行时间,有利于网页的优化