有意思的书签

Bookmarklet是一种使用「书签」运行JS代码的简单浏览器小程序。

使用方法：用鼠标点击对应的链接不放，拖动到浏览器的书签栏即可。

可直接点击文中链接试用

Bookmarklet合集

实用工具

  1. 生成二维码 - 一键生成当前网页的二维码图片
  2. 生成阅读卡片 - 选中文章中的一段文本，生成一张卡片笔记（来自稻米鼠）
  3. 将网页复制为MD - 将网页复制为带标题和链接的Markdown
  4. 网页剪切工具 - 点击后手动选择网页的某个元素可以删除
  5. 解除右键限制 - 某些网站自定义了右键菜单，此功能可以将其还原为原始右键菜单
  6. 网页尺子 - 点击后按住 alt（windows） 或 Option（mac）键即可测量网页元素间距
  7. [显示*号密码](!function%28%29%7Bfor%28var t%3Ddocument.getElementsByTagName%28"input"%29,e%3D0;e<t.length;e++%29"password"%3D%3D%3Dt[e].getAttribute%28"type"%29&&t[e].setAttribute%28"type","text"%29%7D%28%29;%29) - 点击后显示网站输入密码时的*密码
  8. [网页骨架特效](%28function%28dummyze,entry%29%7Bfunction textWalker%28node,cbck%29%7Bvar i%3D-1,n,s,w,h;if%28!node%29%7Breturn %7Dif%28node.nodeType%3D%3D%3D3%29%7Bcbck%28node,'nodeValue'%29;return %7Dif%28node.tagName%3D%3D'IFRAME'%29%7Btry%7BtextWalker%28node.contentDocument.documentElement,cbck%29%7Dcatch%28e%29%7B%7Dreturn %7Dif%28node.tagName%3D%3D'STYLE'||node.tagName%3D%3D'SCRIPT'||node.tagName%3D%3D'SVG'%29%7Breturn %7Dif%28node.tagName%3D%3D'IMG'%29%7Bs%3DgetComputedStyle%28node%29;node.src%3D'https://dummyimage.com/'+(parseInt(s.width)||10)+'x'+(parseInt(s.height)||10)+'/ccc/ccc';return}if(node.tagName%3D%3D'INPUT'||node.tagName%3D%3D'TEXTAREA'){cbck(node,'placeholder');cbck(node,'value'%29;return %7Dif%28node.tagName%29%7Bif%28%28s%3Dnode.getAttribute%28'style'%29%29&&%28s%3D%28s%3DgetComputedStyle%28node%29%29.backgroundImage%29&&%28s!%3D'none'%29&&%28s%3D%28s.match%28/url%28%22%28[^%22]+%29%22%29/%29%29%29&&%28s%3Ds[1]%29%29%7Bpic%3Dnew Image%28%29;pic.onload%3Dfunction%28%29%7Bnode.style.backgroundImage%3D'url%28https://dummyimage.com/'+%28parseInt%28pic.width%29||10%29+'x'+%28parseInt%28pic.height%29||10%29+'/ccc/ccc'+'%29'%7D;pic.src%3Ds;%7Dif%28%28b%3D%28b%3DgetComputedStyle%28node,'::before'%29%29.content%29&&%28b!%3D'none'%29&&b.indexOf%28'attr%28'%29%3D%3D0&&%28b%3Db.match%28/^attr%28%28.%2A?%29%29$/%29%29&&%28b%3Db[1]%29%29%7Bcbck%28node,b%29;%7Dif%28%28b%3D%28b%3DgetComputedStyle%28node,%27::after%27%29%29.content%29&&%28b!%3D%27none%27%29&&b.indexOf%28%27attr%28%27%29%3D%3D0&&%28b%3Db.match%28/^attr%28%28.%2A?%29%29$/%29%29&&%28b%3Db[1]%29%29%7Bcbck%28node,b%29;%7Dwhile%28n%3Dnode.childNodes[++i]%29textWalker%28n,cbck%29;%7D%7D;textWalker%28entry,dummyze%29%7D%29%28function%28n,p,a,w,pic%29%7Bp%3Dp||%27nodeValue%27;a%3Dn[p];if%28a%29%7Bw%3Da.replace%28/\S/g,%27\u2585%27%29;if%28a!%3Dw%29n[p]%3Dw%7Delse%7Ba%3Dn.getAttribute&&n.getAttribute%28p%29;if%28a%29%7Bw%3Da.replace%28/\S/g,%27\u2585%27%29;if%28a!%3Dw%29n.setAttribute%28p,w%29;%7D%7D%7D,document.documentElement%29;!function%28%29%7Bvar%20e%3Ddocument.createElement%28%22style%22%29;e.innerText%3D%22a,article,aside,body,div,dl,dt,dd,figure,h1,h2,h3,h4,h5,head,header,html,iframe,button,img,nav,object,ol,p,section,span,ul%7Bcolor:#ddd!important;%7D%22,document.head.appendChild%28e%29%7D%28%29;%20void%280%29;%29) - 一键去除网页的敏感信息（保留样式），方便截图
  9. Highlight links - 高亮网页中的链接

优化阅读体验

  1. 显示文章大纲 - 在左侧边栏显示当前网页的大纲，适用与不带目录的文章（来自稻米鼠）
  2. 高亮关键词 - 在网页中高亮设定的关键词
  3. [自动滚屏](%28function%28window,%20document%29%20%7B%20var%20isScrolling,%20scrollTimeout;%20var%20defaultScrollSpeed%20%3D%2050;%20var%20scrollSpeed%20%3D%2050;%20var%20adjustIncrement%20%3D%202;%20var%20jumpIncrement%20%3D%2050;%20function%20start%28%29%20%7B%20window.addEventListener%28'keydown',%20keyPressed%29;%20window.addEventListener%28'keyup',%20keyReleased,%20false%29;%20autoScroll%28%29;%20%7D%20function%20autoScroll%28%29%20%7B%20if%28scrollTimeout%29%20%7B%20clearTimeout%28scrollTimeout%29;%20%7D%20window.scrollBy%280,1%29;%20scrollTimeout%20%3D%20setTimeout%28autoScroll,%20scrollSpeed%29;%20isScrolling%20%3D%20true;%20%7D%20var%20keysPressed%20%3D%20[];%20function%20keyPressed%28event%29%20%7B%20keysPressed[event.keyCode]%20%3D%20true;%20console.log%28keysPressed%29;%20var%20commandKey%20%3D%20%28keysPressed[91]%20||%20keysPressed[93]%29;%20var%20leftArrow%20%3D%20keysPressed[37];%20var%20rightArrow%20%3D%20keysPressed[39];%20var%20upArrow%20%3D%20keysPressed[38];%20var%20downArrow%20%3D%20keysPressed[40];%20var%20escKey%20%3D%20keysPressed[27];%20if%20%28escKey%29%20%7B%20if%20%28isScrolling%29%7B%20turnOff%28%29;%20%7D%20else%20%7B%20autoScroll%28%29;%20%7D%20%7D%20if%20%28downArrow%29%20%7B%20event.preventDefault%28%29;%20window.scrollBy%280,%20jumpIncrement%29;%20autoScroll%28%29;%20%7D%20if%20%28upArrow%29%20%7B%20event.preventDefault%28%29;%20window.scrollBy%280,%20-jumpIncrement%29;%20autoScroll%28%29;%20%7D%20if%20%28rightArrow%29%20%7B%20event.preventDefault%28%29;%20scrollSpeed%20-%3D%20adjustIncrement;%20autoScroll%28%29;%20%7D%20if%20%28leftArrow%29%20%7B%20event.preventDefault%28%29;%20scrollSpeed%20+%3D%20adjustIncrement;%20autoScroll%28%29;%20%7D%20%7D%20function%20keyReleased%28event%29%20%7B%20delete%20keysPressed[event.keyCode];%20%7D%20function%20turnOff%28%29%20%7B%20clearTimeout%28scrollTimeout%29;%20isScrolling%20%3D%20false;%20%7D%20start%28%29;%20%7D%29%28window, document%29;%29) - 执行后网页会自动滚屏，按 Esc 停止，按方向键左减速，按方向键右加速
  4. Table borders - 显示网页中表格的边框

图片相关

  1. Bilibili 封面下载 - 下载 Bilibili 视频的封面
  2. 公众号封面下载 - 下载微信公众号文章的封面
  3. [查看所有图片](outText%3D'';for%28i%3D0;i<document.images.length;i++%29%7Bif%28outText.indexOf%28document.images[i].src%29%3D%3D-1%29%7BoutText+%3D'<img style%3Dmax-width:800px src%3D'+document.images[i].src+'>'+document.images[i].naturalWidth+'x'+document.images[i].naturalHeight+'

    '%7D%7D;if%28outText!%3D''%29%7BimgWindow%3Dwindow.open%28'','imgWin'%29;imgWindow.document.write%28'

    <table style%3Dmargin:auto border%3D1 cellpadding%3D10>ImageSize

    '+outText+'

    '%29;imgWindow.document.close%28%29%7Delse%7Balert%28'%E6%B2%A1%E6%9C%89%E5%9B%BE%E7%89%87%EF%BC%81'%29%7D%29) - 一键查看当前网页的所有图片

  4. 高亮所有图片 - 一键高亮网页上的所有图片，点击可显示图片地址
  5. 隐藏所有图片 - 一键隐藏网页所有图片
  6. 放大网页图片 - 一键放大网页上所有图片
  7. 缩小网页图片 - 一键缩小网页上的所有图片
  8. 百度以图搜图 - 点击后选择图片快速以图搜图
  9. 谷歌以图搜图 - 同上

分栏搜索

  1. 百度边栏搜索 - 在侧边打开一个百度搜索边栏
  2. 谷歌边栏搜索 - 在侧边打开一个Google搜索边栏
  3. 必应边栏搜索 - 在侧边打开一个必应搜索边栏

站内搜索

  1. 百度站内搜索 - 一键在百度搜索当前网页的关键词
  2. 谷歌站内搜索 - 一键在Google搜索当前网页的关键词
  3. 必应站内搜索 - 一键在必应搜索当前网页的关键词

有趣工具

  1. 查看当前时间 - 查看当前时间
  2. 年度时间进度条 - 用进度条显示今年进程

参考资料