并非所有的黑客行为都是恶作剧。下面是如何使用JavaScript使浏览器更好的方法。
JavaScript的在线资源并不缺乏，从教你基础知识的课程到应用程序创建的教程。在本文中，我将解释如何使用JavaScript创建有用的浏览器黑客，以提高您的Web体验和提高工作效率。这篇文章不需要您自己开发应用程序，甚至不需要对产品有特别深入的了解。
书签的力量
我们都知道书签有多有用。它们允许您保存到网页的链接，对其进行分类，并添加其他数据(元数据)，以帮助您在将来快速找到该链接，并将其存档到您可以轻松导航的结构中。许多人不知道的是，您还可以将微小的代码片段保存到这些书签中，这些书签是在您所在的网页的上下文中执行的，包括对其结构和样式的访问。
如果你打开Facebook控制台，你会发现它的开发者非常反对这种窥探-这是有理由的。即使没有访问他们的代码，你也可以进行修改，甚至破坏一些应用程序。
Facebook的开发者不想让你弄乱他们的控制台。
不过，你可能会忘记你输入的内容，或者丢失一些文本。或者，如果您像我一样，保存您打开的文件，复制它们，到您想要的网站，打开控制台，粘贴和运行的过程似乎需要很大的努力。下面是一些我用来检查网页的长度的代码(用我正在使用的设备上的屏幕来衡量)。这在Edge，Firefox，Chrome，甚至我的手机上都适用：
javascript:alert(document.body.scrollHeight / window.innerHeight)
如果我知道一页有多长，我可以预先决定是否要读。我用它来向客户展示各种设备上有多大或多小的网页。
下面是我使用的另一个工具，用于删除程序员博客文章中的所有图片和文章，只获取高光部分(我还会对它们进行书签；我不会将浏览作为阅读的替代方案)。
javascript:(function(){ [].slice.call(document.querySelectorAll('img, .gist')).forEach(function(elem) { elem.remove(); }); })()
您会注意到，大多数代码并不复杂；实际上，有些代码非常简单。因为这些主要是我个人用的，简单就行了。如果我把这些放在要点中，其他人可以分叉并更新它们，我们可能会有更好的书签。
使用加载项在整个web上进行持久更改。
我们大多数不是网页设计师的人不想要多个浏览器的麻烦。我们也不希望我们的链接被JavaScript片段弄得乱七八糟。我要说的是，我不是在写你自己的插件，而是用现有的插件来增强你的网络体验。
问题
当我第一次开始使用Reddit和Imgur我发现他们的画廊编辑很困难。我本可以停止使用这些工具，但是我需要找到另一个在线服务并上传我的媒体。而且，我可能会忘记并返回Imgu，并且无法浏览我自己的内容。我的解决方案是在控制台和页面检查器中四处游玩，看看我是否能从他们的服务中得到我想要的东西。
右击，然后单击“检查元素”，立即查看网页的结构。
大约五分钟后，我注意到大图片和小缩略图之间的细微差别。我需要更大的图片，这样我就可以看到我在拖什么，并建立一些叙事顺序。
解
我想出的代码比较简单，只有七行。重点不是写最少的代码，甚至是最干净的代码，而是简单地完成任务：开火忘记！
(function(jQuery) { jQuery('.sortable-image img, .sortable-image').css({width:'auto',height:'auto'}) jQuery('.sortable-image img').each( function(e,elem) { var fixedImg = jQuery(this).attr('src').replace('s.png','.png'); jQuery(this).attr( 'src', fixedImg ); }); })(jQuery);
首先，我告诉网页删除高度和宽度限制，然后循环遍历每个可排序的图像，并替换部分文件名。它不是最干净的代码；它依赖于Imgu的DOM结构保持不变，并拥有jQuery库，但是它的思想是获得所需的东西，这样您就可以继续了。而且，它比向开发团队发送电子邮件以更改每个人的体验要有效得多，因为您发现它很难使用。
我对此使用了一个外接程序，据我所知，它并不是严格意义上的OpenSource(尽管如果您能够找到ChromiumUser-profile文件夹，您确实可以访问代码)[用户JavaScript和CSS]但是它允许您做您想做的事情，甚至可以实现脚本在特定URL或URL模式上运行的规则。
(请注意，Imgu不再使用相同的DOM，因此上面的代码不再工作了。对于您以这种方式发布的大部分代码来说，这是正确的，并且将继续如此。它不是为建立一个帝国而设计的，只是为了让你的生活变得单调乏味。
创作加载项