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)
相关推荐
Lee川4 小时前
Milvus 实战:当 RAG 遇上向量数据库,从"玩具 Demo"到"生产可用的"那一步
前端·数据库·人工智能
2501_930707784 小时前
使用C#代码在 PowerPoint 中组合或取消组合形状
开发语言·c#
晚烛4 小时前
CANN 调试工具与性能剖析:从日志分析到 NPU 行为追踪的完整调试体系
开发语言·windows·python·深度学习·缓存
anOnion4 小时前
构建无障碍组件之Toolbar Pattern
前端·html·交互设计
惊鸿一博5 小时前
图标加载方式_zeroIcon_是否加前缀mdi
开发语言·前端·javascript
森G5 小时前
TypeScript 基础类型
开发语言·typescript
2501_940041745 小时前
前端工程化进阶:5个高交互与可视化项目提示词
前端
你很易烊千玺5 小时前
JS 异步 从零讲(大白话 + 真实场景 + 可运行案例)
前端·javascript·vue.js
huipeng9266 小时前
企业级微服务开发实战(一):项目启动与工程化设计
java·开发语言·spring boot·spring cloud·微服务·云原生·架构
爱吃土豆的马铃薯ㅤㅤㅤㅤㅤㅤㅤㅤㅤ6 小时前
java实现excel导入、下载模板方法
java·开发语言·excel