本文学习自
使用console.log打印公司招聘信息和字符画
https://www.jianshu.com/p/e8189b389f88
我做的效果如下
如下
<!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>
if (window.console) {
console.log('想和我一起抗击病毒吗？\n想让自己拯救更多的人吗？\n加入我们，在这里不仅是工作，更是生命价值的体现\n期待你的加入。');
console.log("诚聘疫情拯救者，%c拯救人类简历地址", "color:blue;font-weight:bold;");
console.log("请在邮件中注明%c来自:console", "color:red;font-weight:bold;");
}
</script>
<script>
Function.prototype.makeMulti = function(){
let l = new String(this)
l = l.substring(l.indexOf("/*")+3,l.lastIndexOf("*/"))
return l
}
let string = function(){/*
_____ _____ _____ _____
/\ \ /\ \ /\ \ /\ \
/::\____\ /::\ \ /::\ \ /::\ \
/:::/ / \:::\ \ /::::\ \ /::::\ \
/:::/ / \:::\ \ /::::::\ \ /::::::\ \
/:::/ / \:::\ \ /:::/\:::\ \ /:::/\:::\ \
/:::/____/ \:::\ \ /:::/__\:::\ \ /:::/__\:::\ \
/::::\ \ /::::\ \ /::::\ \:::\ \ /::::\ \:::\ \
/::::::\ \ _____ ____ /::::::\ \ /::::::\ \:::\ \ /::::::\ \:::\ \
/:::/\:::\ \ /\ \ /\ \ /:::/\:::\ \ /:::/\:::\ \:::\____\ /:::/\:::\ \:::\ \
/:::/ \:::\ /::\____\/::\ \/:::/ \:::\____\/:::/ \:::\ \:::| |/:::/__\:::\ \:::\____\
\::/ \:::\ /:::/ /\:::\ /:::/ \::/ /\::/ |::::\ /:::|____|\:::\ \:::\ \::/ /
\/____/ \:::\/:::/ / \:::\/:::/ / \/____/ \/____|:::::\/:::/ / \:::\ \:::\ \/____/
\::::::/ / \::::::/ / |:::::::::/ / \:::\ \:::\ \
\::::/ / \::::/____/ |::|\::::/ / \:::\ \:::\____\
/:::/ / \:::\ \ |::| \::/____/ \:::\ \::/ /
/:::/ / \:::\ \ |::| ~| \:::\ \/____/
/:::/ / \:::\ \ |::| | \:::\ \
/:::/ / \:::\____\ \::| | \:::\____\
\::/ / \::/ / \:| | \::/ /
\/____/ \/____/ \|___| \/____/
*/ }
console.log(string.makeMulti());
</script>
</body>
</html>
如何实现
1.打印招聘信息
if (window.console) {
console.log('想和我一起抗击病毒吗？\n想让自己拯救更多的人吗？\n加入我们，在这里不仅是工作，更是生命价值的体现\n期待你的加入。');
console.log("诚聘疫情拯救者，%c拯救人类简历地址", "color:blue;font-weight:bold;");
console.log("请在邮件中注明%c来自:console", "color:red;font-weight:bold;");
}
这里用到了console.log的占位符，这里就简单列一下，如果大家感兴趣的话可以找资料具体了解下
占位符 含义
%s 字符串
%d or %i 整数
%f 浮点数
%o Object对象
%c css样式
2.打印字符画
我们可以到patorjk生成自己的字符画，然后通过代码输出到控制台
该网站共有314种不同风格的字符画，我们可以挑选自己喜欢的风格
<script>
Function.prototype.makeMulti = function(){
let l = new String(this)
l = l.substring(l.indexOf("/*")+3,l.lastIndexOf("*/"))
return l
}
let string = function(){/*
_____ _____ _____ _____
/\ \ /\ \ /\ \ /\ \
/::\____\ /::\ \ /::\ \ /::\ \
/:::/ / \:::\ \ /::::\ \ /::::\ \
/:::/ / \:::\ \ /::::::\ \ /::::::\ \
/:::/ / \:::\ \ /:::/\:::\ \ /:::/\:::\ \
/:::/____/ \:::\ \ /:::/__\:::\ \ /:::/__\:::\ \
/::::\ \ /::::\ \ /::::\ \:::\ \ /::::\ \:::\ \
/::::::\ \ _____ ____ /::::::\ \ /::::::\ \:::\ \ /::::::\ \:::\ \
/:::/\:::\ \ /\ \ /\ \ /:::/\:::\ \ /:::/\:::\ \:::\____\ /:::/\:::\ \:::\ \
/:::/ \:::\ /::\____\/::\ \/:::/ \:::\____\/:::/ \:::\ \:::| |/:::/__\:::\ \:::\____\
\::/ \:::\ /:::/ /\:::\ /:::/ \::/ /\::/ |::::\ /:::|____|\:::\ \:::\ \::/ /
\/____/ \:::\/:::/ / \:::\/:::/ / \/____/ \/____|:::::\/:::/ / \:::\ \:::\ \/____/
\::::::/ / \::::::/ / |:::::::::/ / \:::\ \:::\ \
\::::/ / \::::/____/ |::|\::::/ / \:::\ \:::\____\
/:::/ / \:::\ \ |::| \::/____/ \:::\ \::/ /
/:::/ / \:::\ \ |::| ~| \:::\ \/____/
/:::/ / \:::\ \ |::| | \:::\ \
/:::/ / \:::\____\ \::| | \:::\____\
\::/ / \::/ / \:| | \::/ /
\/____/ \/____/ \|___| \/____/
*/ }
console.log(string.makeMulti());