java打印js弹窗 js打印信息_js打印内容没有样式


在日常的编码过程中，对于console属性知道得最多，用得最多的都是console.log属性，其实console也有其他许多不同的属性，分别有着不同的作用

assert(断言)

  • 接收两个参数，第一个参数是表达式，第二个参数是字符串。当第一个参数为false才会执行第二个参数
console.assert(assertion, msg);assertion：表达式，如果assertion为假，则会在控制台输出，msg为输出的内容。

clear(清空)

  • 清空控制台内容，光标返回第一行
console.clear()

count(计数)

  • 用于统计打印的console数量，可以指定label(非必传)，打印出指定label的数量
console.count([label]);

error(警告)

  • 会在控制台出现一个红色查查图标显示信息
console.error();

group && groupEnd(分组)

  • console.group用于展示分组，可以对信息做层叠操作，groupEnd则可以结束内联分组
console.group('第一层'); console.group('第二层'); console.log('error'); console.error('error'); console.warn('error'); console.groupEnd(); ----结束第一层console.groupEnd(); ----结束第二层

groupCollapsed&&groupEnd(分组折叠)

  • 与console.group方法很类似，唯一的区别是该组的内容，在第一次显示时是收起的(collapsed)，而不是展开的
console.groupCollapsed('第一层'); console.groupCollapsed('第二层'); console.log('error'); console.error('error'); console.warn('error'); console.groupEnd(); ----结束第一层console.groupEnd(); ----结束第二层

info && log

  • 打印信息
console.log() console.info()

table(打印表格)

  • 将信息通过表格的形式打印出来
let tabelData = { a:{ data1: "1"}, b:{ data2: "2"}, c:{ data3: "3" }}

time&&timeEnd(计时器)

  • 你可以console.time()启动一个计时器(timer),并且通过console.timeEnd结束计时器， 从而得到某一个操作的操作时长
console.time() console.timeEnd()

trace(打印栈信息)

  • 打印该处的函数调用栈信息
console.trace

warn(警告)

  • 会在控制台出现一个黄色感叹号图标显示信息
console.wran()

dir

  • 打印显示一个对象的所有属性和方法

console.dir()

profile && profileEnd(性能分析)

  • 分析函数性能
console.profile() 执行函数 console.profile()

debug(调试)

  • 输出“调试”级别的消息且仅仅控制台配置为显示调试输出时才显示该消息
  • 注意事项：谷歌浏览器和opera不支持该方法
console.debug()

momory

  • 使用console.memory(注意memory是console的属性，不是函数)，来查看当前的堆的使用情况
  • 注意事项：属性是不用()触发的
console.menory

占位符

占位符 作用

%s 字符串

%d or % i整数

%f 浮点数

%o 可展开的DOM

%O 列出DOM的属性

%c 根据提供的css样式格式化字符串

几种常见用法

  • %o、%O都是用来输出Object对象的，对普通的Object对象，两者没区别，但是打印dom节点时就不一样了：
- 格式成可展开的的DOM，像在开发者工具Element面板那样可展开 console.log('%o',document.body.firstElementChild); - 像JS对象那样访问DOM元素，可查看DOM元素的属性 - 等同于console.dir(document.body.firstElementChild) console.log('%O',document.body.firstElementChild);
  • %c占位符是最常用的。使用%c占位符时，对应的后面的参数必须是CSS语句，用来对输出内容进行CSS渲染。常见的输出方式有两种：文字样式、图片输出。
console.log("%cHello world