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)
相关推荐
又尔D.17 分钟前
vue3+webOffice合集
vue.js·weboffice
BinaryBardC1 小时前
Swift语言的网络编程
开发语言·后端·golang
code_shenbing1 小时前
基于 WPF 平台使用纯 C# 制作流体动画
开发语言·c#·wpf
邓熙榆1 小时前
Haskell语言的正则表达式
开发语言·后端·golang
ac-er88882 小时前
Yii框架中的队列:如何实现异步操作
android·开发语言·php
马船长2 小时前
青少年CTF练习平台 PHP的后门
开发语言·php
hefaxiang3 小时前
【C++】函数重载
开发语言·c++·算法
古蓬莱掌管玉米的神4 小时前
vue3语法watch与watchEffect
前端·javascript
落幕4 小时前
C语言-构造数据类型
c语言·开发语言
林涧泣4 小时前
【Uniapp-Vue3】uni-icons的安装和使用
前端·vue.js·uni-app