console.log妙用

最新推荐文章于 2023-10-07 13:44:34 发布

ICY___

最新推荐文章于 2023-10-07 13:44:34 发布

阅读量315

点赞数

分类专栏： ICY___的前端入门问答--问题解答

原文链接：http://www.alloyteam.com/2013/11/console-log/

版权

问答--问题解答同时被 2 个专栏收录

29 篇文章 0 订阅

订阅专栏

ICY___的前端入门

23 篇文章 0 订阅

订阅专栏

今天看到了一些console.log的用法现在分享给大家：方法来自http://www.alloyteam.com/2013/11/console-log/

转载自AlloyTeam：http://www.alloyteam.com/2013/11/console-log/

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // console.log() 的一些使用方法
        // 1.区分变量
        let a=1,b=2;
        console.log(a,b);// 1 2 
        console.log({a},{b});// {a: 1} {b: 2}
        // 2.输出样式：  
        // 写在前面  %d 数字  %s 字符串  %o 对象
        let value='hello world';
        console.log( '%c12312', 'font-size: 20px; color : yellow');
        console.log('%c1%c2%c3','color:red','color:blue','color:green');//样式和%c后面的数值一一对应
        console.log('%d * %d =',2,2,4);//有点类似于像是匹配模板
    </script>
</body>
</html>

输出结果：