console

console.log()

• console.log()方法用于在控制台输出信息
• console.log方法会自动在每次输出的结尾，添加换行符
• 它可以接受一个或多个参数，将它们连接起来输出

var num=1999
console.log('a', 'b', 'c');
console.log('a',num,'c');
//a b c
//a 1999 c

• 变量和字符串一起输出方法

1. 它可以接受一个或多个参数，将它们连接起来输出
2. 字符串拼接 +
3. es6模板字符串
   

• 可以有多个参数，如果第一个参数是字符串且有占位符，后面的参数用来代替占位符的真是内容

console.log("%s love you", "yanyan")
//会输出 yanyan love you  
//第二个参数就代替了 第一个占位符%s

console.log("%s有%f米高", "yanyan", 1.76);
//会输出 yanyan有1.76米高
//其中 yanyan代替了%s,  1.76代替了%f

console.error()

console不仅可以打印普通的日志还可以打印报红的日志
console.error('修改失败',res)

占位符

格式占位符	作用
%s	字符串
%f	浮点数
%d 或 %i	整数
%o
%O	列出DOM的属性
%c	根据提供的css样式格式化字符串

• %o和%O在普通对象上的表现是一样的，但是在DOM上就有区别了：

// 格式成可展开的的DOM，像在开发者工具Element面板那样可展开 
console.log('%o',document.body.firstElementChild); 

// 像JS对象那样访问DOM元素，可查看DOM元素的属性 
// 等同于console.dir(document.body) 
console.log('%O',document.body);

• %c占位符是最常用的，使用%c占位符时，对应的后面的参数必须是CSS语句，用来对输出内容进行CSS渲染。于是，利用%c配合CSS可以做出吊炸天的效果，比如背景色、字体颜色渐变、字体3D效果、图片等，甚至可以是火星文、表情包等。

console.log("%cHello,yanyan","color: red; font-size: 100px"); 
//输出红色的、100px大小的 Hello,yanyan！

注意：

1. console不能定义img，因此用背景图片代替。
2. console不支持width和height，利用空格和font-size代替；还可以使用padding和line-height代替宽高。
3. console输出url会自动变为可以点击的超链接