大家好，我是石小石！一个热爱技术分享的开源社区贡献者，小册《油猴脚本实战指南》作者。
鸡汤来喽
这几天干活心累，闲暇之余就会看看毒鸡汤，净化心灵。但是，每次百度搜毒鸡汤体验感太差，于是，我手写了个鸡汤生成脚本。
百度不动了，喂自己几口鸡汤：
掘金看累了，喂自己几口鸡汤：
实现原理
谷歌浏览器安装油猴扩展插件
实现这样一个有趣的脚本实际非常简单，首先需要安装谷歌扩展插件-油猴（Tampermonkey）
如果你不了解什么是油猴，参考这篇文章。
在Chrome应用商店中，搜索 "篡改猴"、"油猴" 或 "Tampermonkey"等关键词，搜索出扩展应用后，点击「添加至Chrome」进行安装。
油猴（Tampermonkey）作为一款浏览器插件，允许用户在网页加载时注入自定义的 JavaScript 脚本，来增强、修改或自动化网页行为。
通俗地说，借助油猴，我们可以将自己的 JavaScript 代码"植入"任意网页，实现自动登录、抢单、签到、数据爬取、广告屏蔽等各种"开挂级"功能，彻底掌控页面行为。
油猴安装好后，点击油猴的添加新脚本
在代码模板中，我们就可以写入前端代码了。
"毒鸡汤"的跨域数据获取与渲染
毒鸡汤的文案数据来自一个开放接口：
每次调用接口都会随机返回一句毒鸡汤，非常适合用作脚本中的内容来源。由于油猴脚本运行在任意网页上，直接发起请求时容易遇到跨域限制。为了解决这个问题，我们可以使用 Tampermonkey 提供的跨域请求 API ------ GM_xmlhttpRequest。它可以绕过浏览器的同源策略，安全地获取第三方接口数据。
以下是一个"鸡汤来喽"的调用示例：
js
GM_xmlhttpRequest({
method: 'GET',
url: 'https://api.btstu.cn/yan/api.php?charset=utf-8&encode=json',
onload: function (res) {
try {
const data = JSON.parse(res.responseText);
textContent = `💀 ${data.text}`;
} catch (e) {
textContent = '💀 鸡汤炸了';
}
},
onerror: function () {
textContent = '💀 鸡汤没了';
}
});最后，我们结合油猴的 GM_addElement 和 GM_addStyle 将毒鸡汤渲染到网页上，就能实现一个简单有趣的文案展示脚本。
快速体验地址
为了方便大家快速体验脚本，可以直接通过下面的地址安装：
注意，安装脚本前一定要先给谷歌安装油猴插件！
如何学习油猴脚本开发
油猴脚本开发非常简单，如果你懂HTML+CSS+Javascript，了解一些基础概念后，就可以直接上手开发了。
油猴官方提供了一个文档（英文）
www.tampermonkey.net/changelog.p...
如果你不想看繁琐的官方文档，也可以看看我写的油猴脚本实战指南。