用自定义插件将掘金的文章缓存到本地（收藏怪的福音）

如果直接打印默认的文章页面，无关的内容过多，而且排版也不咋地

每次手动去调整文章样式的话，又显得很是繁琐，然后就有了这个小工具

主要是用到了大名鼎鼎的的网页插件 tampermonkey，俗称 油猴

插件安装

谷歌浏览器插件获取地址：www.extfans.com/

谷歌浏览器在地址栏输入 chrome://extensions/，开启右上角的开发着模式，下载的插件直接拖进来完事

油猴插件

通过油猴的配置，可以让我们的脚本，在页面的任意加载期间运行，比如在页面上拦截广告（直接用现成的AdBlock多香），或者对指定的页面做一些定制化的处理（如这里分享给大家的脚本），或者对当前站点执行一些不用跨域的 http 请求？

直接开发一个插件，需要特定的目录结构和配置要求，显得比较繁琐，油猴插件可以让我们专注于编写 js 脚本

添加脚本

在工具栏通过油猴的插件图标进入，添加新脚本

把下面的代码全部覆盖贴进去，再启用脚本即可

这串代码主要是在掘金的文章页起效（由 @match 中的正则 URL匹配），监听了 ctrl + p 组合，阻止默认事件，调整好页面后直接调用 window.print()，最后再复原页面

// ==UserScript==
// @name         打印掘金文章
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       安逸的咸鱼
// @match        https://juejin.cn/post/*
// @grant        none
// ==/UserScript==

(function() {
	'use strict';
	window.onload = function() {
		document.onkeydown = function(e) {
			if (e.ctrlKey && e.keyCode == 80) {
				let old = document.body;
				let html = document.getElementsByTagName('article');
				document.body.outerHTML = html[0].outerHTML.replace(/复制代码/g, '');
				document.body.style.padding = '30px';
				html[0].getElementsByClassName('author-info-block')[0].outerHTML = '';
				window.print();
				document.body = old;
				return false;
			}
		}
	}
})();

缺点

在新的文章页直接打印的话，会没有图片，通过 f12 发现掘金走的 http1.1 协议，大致表现形式就是鼠标滚动到一定程度，自动加载后一页的内容，现在仅仅有个想法就是在调用打印操作的时候，让页面的图片都触发加载完成

最后

如果你们用的是其他的浏览器，可以去浏览器的插件中心找找，如果能在那里找到 油猴 或者类似的插件，直接怼上去就行，要是么有的话，可以尝试将谷歌的插件包拖进扩展程序看能否正常安装（反向证明此浏览器换皮）