关于Console控制台输出的玩法
你在浏览网页的时候,是否注意过这些网页的控制台输出了什么?
Console这种东西,其实一般只有前端工作者才会注意到。console在我们实际开发中可是个宝贝,他是各种error和warning的展示窗口,通过console我们才能知道自己的网页出了什么毛病,虽然我想吐槽的是,有的时候没毛病它会爆一堆红,(懵逼脸)有问题的时候又干干净净。不管怎么说,它可以展示信息。并且在很久的一段时间,我对console的理解也就如此,知道有一次我点开百度,想看源码的时候不小心瞄到了:

卧槽,厉害了呀。我咋没想到呢,当时就给机智的百度点个赞。然后下意识的打开了天猫,摁下f12:
惊呆了好吧~~一家比一家脑洞清奇,天猫还良心的给不小心打开控制台的小白警告,业界良心哇!
相似的还有如下:

这样的O__O"…:

12306:

城会玩:

当然也有这样式的,调试用的console.log忘记删了吧:

以前我咋没发现console还能这么玩呢,简直是打开了新世界的大门啊。看了一下这些网站这部分的代码,大概知道怎么个玩法了~~
不过写到这里已经快下班了,就不详细说了,上一张图搞定一切:

这是代码:
console.log("%c好神奇呀~","font-size:30px;color:white;background:deeppink;border-radius:2px;")
console.log("%c哇哇哇哇哇!","font-size:30px;background:linear-gradient(to bottom,deeppink,pink,orange);;border-radius:4px;")
console.log("%c看兔斯基!!!","font-size:30px;color:white;text-shadow:2px 2px 1px gold")
console.log("%c","padding:120px 120px;line-height:100px;background:url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1487679947503&di=089b71b243d7805692f6af9fea7247ba&imgtype=0&src=http%3A%2F%2Fimg3.duitang.com%2Fuploads%2Fblog%2F201408%2F20%2F20140820122446_kHVcj.gif') no-repeat")
ok,收工回家~
关于Console控制台输出的玩法的更多相关文章
- Spring Boot2解决idea console 控制台输出乱码
Idea默认配置是采用GBK, 而项目工程文件采用的是UTF-8. 编码不一致,导致idea Console控制台输出乱码. 网上的解决方案,大都是直接修改Settings=>Editor=&g ...
- 代码调试console对象的花式玩法
转自阮一峰http://www.ruanyifeng.com/home.html console.log(),console.info(),console.debug() console.log方法用 ...
- Chrome 控制台新玩法-向输出到console的文字加样式
Chrome 控制台新玩法-向输出到console的文字加样式 有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字 ...
- Chrome 控制台新玩法-console显示图片以及为文字加样式
有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...
- 【转】Chrome 控制台新玩法-console显示图片以及为文字加样式
在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.log()方法外还可以调用 cosole.warn() 来输出警告信息,在控制台 ...
- js控制台输出console
介绍: js的console你可以在firefox的firedbug或者ie和google的f12调试模式下看到,这些主流浏览器的调试模式的控制可以输出一些信息,你的一些js代码测试可以直接在cons ...
- 控制台屏蔽某console的输出
有时候需要调试一个在线网站. 打开 chrome 控制台,其中有一些 console.log 不停的输出. 这样的话就影响了我们使用控制台调试页面. 那么怎样不让那一句(或多句)console.log ...
- 前端不为人知的一面--前端冷知识集锦 前端已经被玩儿坏了!像console.log()可以向控制台输出图片
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...
- PHP内置Web Server探究(二)自定义PHP控制台输出console函数
我们在开发APP的服务器端,当和APP进行联调时通常需要实时跟踪URL请求和参数的接收情况. 但PHP并没有像Python或Java专有的控制台输出函数,Python的print()和Java的Sys ...
随机推荐
- IOS9提示“不受信任的开发者”如何处理
iPhone升级到IOS9版本后,发现部分APP在下载后首次运行时,都会提示“不受信任的应用程序开发者”,这是因为企业证书发布的APP,没有经过AppStore审核,于是iOS对用户做出一个安全性的提 ...
- 【转】Linux Shell脚本面试25问
Q:1 Shell脚本是什么.它是必需的吗? 答:一个Shell脚本是一个文本文件,包含一个或多个命令.作为系统管理员,我们经常需要使用多个命令来完成一项任务,我们可以添加这些所有命令在一个文本文件( ...
- pageX,clientX,screenX,offsetX区别
pageX/pageY:鼠标相对于整个页面的X/Y坐标.注意,整个页面的意思就是你整个网页的全部,比如说网页很宽很长,宽2000px,高3000px,那pageX,pageY的最大值就是它们了.特别说 ...
- ASIHTTPRequest异步请求 分类: ios技术 2015-03-01 09:33 48人阅读 评论(0) 收藏
我们运行程序,如果网速很慢,查询的时候会一直黑屏,直到请求结束画面才出现,这样用户体验很不好.因此同步请求一般只是在某个子线 程中使用,而不在主线程中使用.异步请求的用户体验要比同步请求好,因此一般情 ...
- Java Spring MVC项目搭建(二)——项目配置
1.站点配置文件web.xml 每一个Spring MVC 项目都必须有一个站点配置文件web.xml,他的主要功能吗....有一位大哥已经整理的很好,我借来了,大家看看: 引用博客地址: http: ...
- UVa 11456 - Trainsorting
题目大意:给一个车辆到达车站的序列(按时间先后),可以对车辆进行以下处理:插在队首.插在队尾或者拒绝进站.车站内的车辆必须按照重量大小从大到小排列,问车站内最多能有多少辆车辆? 假设车i是第一个进站, ...
- BZOJ 2179FFT快速傅立叶
传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=2179 题目大意:给出两个n位10进制整数x和y,你需要计算x*y. 题解:FFT,不会的可以 ...
- 使用PHP和HTML5 FormData实现无刷新文件上传教程
无刷新文件上传是一个常见而又有点复杂的问题,常见的解决方案是构造 iframe 方式实现. 在 HTML5 中提供了一个 FormData 对象 API,通过 FormData 可以方便地构造一个表单 ...
- idea 15破解方法记录
So easy! Only one step. 注册时选择 License server ,填 http://idea.lanyus.com 对于Clion等同样适用.
- 内容页获取当前栏目的上一级栏目ID
发现V9在列表页可以用$parentid 得到当前栏目的父级ID,但在内容页这个函数的值却为空了,需要按下面的写法才行, V9 在内容页获取当前栏目的上一级栏目ID {$CAT[parentid]} ...