console.log输出五彩斑斓的颜色

console.log 最经常使用它在控制台输出信息然后进行代码调试,会发现输出信息的颜色永远是黑色。本文教学如何用 console.log在控制台输出具有五彩斑斓颜色的信息。

单色输出

javascript 复制代码
console.log('\x1B[31m红色\x1B[34m 蓝色')
javascript 复制代码
console.log('%c字符:', 'color:red', type)
javascript 复制代码
console.log('%c当前环境:' + type, 'color:blue')

多色输出

javascript 复制代码
console.log('%c123%c456', 'color: blue', 'color: green')
console.log.apply(void 0, ['%c123%c456', 'color: blue', 'color: green'])

背景输出

javascript 复制代码
console.log('\x1b[43m背景')

背景+颜色输出

javascript 复制代码
console.log('%c hello world ',
      'background: black; color: red')

背景+颜色+样式输出

javascript 复制代码
console.log('%c 输出 %c 大大 a %c 颜色', 'color:red;', 'font-size:30px;', 'color:blue;background:yellow;')

其他输出

warn输出:

javascript 复制代码
console.warn('hello world')

error输出:

javascript 复制代码
console.error('hello world')

body输出:

javascript 复制代码
console.log('%o', document.body)
相关推荐
Predestination王瀞潞39 分钟前
IO操作(Num22)
开发语言·c++
光影少年2 小时前
angular生态及学习路线
前端·学习·angular.js
宋恩淇要努力2 小时前
C++继承
开发语言·c++
沿着路走到底3 小时前
python 基础
开发语言·python
記億揺晃着的那天4 小时前
Vue + Element UI 表格自适应高度如何做?
javascript·vue.js·ui
无尽夏_4 小时前
HTML5(前端基础)
前端·html·html5
Jagger_4 小时前
敏捷开发流程-精简版
前端·后端
沐知全栈开发4 小时前
C# 委托(Delegate)
开发语言
FIN66684 小时前
昂瑞微冲刺科创板:创新驱动,引领射频芯片国产化新征程
前端·安全·前端框架·信息与通信·芯片
GISer_Jing4 小时前
ByteDance——jy真题
前端·javascript·面试