[推薦] 常用的書籤小工具(bookmarklet)

[mayuyu (‵・ω・′)]

有一些瀏覽網頁時常會用到的小功能，需要的功能很小很簡單，
為此特別裝一個很大的擴展來做實在很浪費，
可是沒有這些功能又很不方便，這時候精簡的書籤小工具就很好用，
書籤小工具放在書籤工具列上，跟一個普通的書籤一樣，平時不佔資源，
要用的時候點一下就可以啟動，加上自訂圖示之後跟快捷的工具按鈕沒兩樣，
可以幫助節省很多操作的時間。

版上有好幾篇分享書籤小工具的文章，我整理修改了一些常用的bookmarklet，
還有提供三個加快使用bookmarklet的方法，以及自訂書籤圖示，
順便也請大家分享其他好用的書籤小工具。

使用方法：
將以下各個功能的程式碼文字全選複製拖到書籤工具列上，
為這個書籤取個好記的名字，以後點一下就可以用了。


＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
一鍵縮網址，按下去會自動將當前分頁的網址縮成對應的短網址
goo.gl
bit.ly
TinyURL!
PPT短網址工具
Just 0rz!!
>> http://notepad.cc/share/IHabtTylxH <<

顯示當前網站所儲存的cookie內容
一鍵刪除當前網站所儲存的cookie
>> http://notepad.cc/share/piTSqqWLEC <<

感覺沒什麼用的功能，不想存cookie的話可能大都直接關閉瀏覽器的
允許網站儲存cookie的選項，少數需要的網站才單獨設定開放。
還有現在DOM storage會存到webappsstore裡面(Fx)，
所以我沒事會把Fx設定資料夾下的webappsstore.sqlite給刪掉，
有時候網站會存很多垃圾在裡面，webappsstore.sqlite竟然會大到好幾GB。


解除網頁「不能選取複製文字、不能開啟右鍵選單」的限制
不過在框架裡沒用，還是需要像RightToClick的擴展(Fx)。
>> http://notepad.cc/share/IMw22o1WNn <<

同上，解除鎖定滑鼠按鍵功能的限制，不過這個是開關型，
按一下會解鎖，再按一次會重新上鎖。
有些網頁會有自己設計的右鍵選單，有時候我們還是會需要用到
這些自行設計的右鍵選單的功能，這時這個書籤就很好用，
要用原來網頁自己的選單，再按一次就可以直接恢復，不用重新整理整個網頁。


明文顯示密碼
顯示密碼欄位的********星號為明碼，可以避免密碼反覆輸入錯誤卻看不出來。

允許密碼儲存
有些網站會限制不允許自動填入表單，瀏覽器不會記憶這些網站的帳號密碼，
每次登入都要重新輸入好麻煩，用這個書籤就可以解除這個限制，
讓瀏覽器能夠記憶這些網站的帳密。
>> http://notepad.cc/share/urczVMagjU <<


IP Geo Lookup
反查網站的IP或域名的資料。
如果有選取網頁上的文字，例如選取ptt.cc，
會自動開新分頁檢索ptt.cc的IP/域名資訊和網站所在的地理位置；
如果沒有選取文字，會自動以當前分頁的網址為檢索對象。
這個whois功能很詳細，除了IP的基本資料和地圖位置，
點進去連結的網頁還有更進一步的資訊，包括會列出這個IP是否有列在
廣告黑名單，或者是已知的「公開proxy」的封鎖名單的資料庫裡面。
有些網站會封鎖這些已知的公開proxy，用這些proxy連過去一樣會被禁止，
所以用這個IP Geo Lookup檢索可以事先告訴我們這組proxy有沒有用。
>> http://notepad.cc/share/jkubGanpAu <<


Google站內搜索
有選取文字的話會自動開新分頁，用Google檢索當前網站內
含有這個文字的網頁，例如在yahoo網站下選取"拍賣"，
會開新的Google搜尋分頁，在yahoo網站內搜尋"拍賣"這個關鍵字。
沒有選取文字則會要求輸入檢索的文字，
等於自動在檢索文字後面加上 site: 限定搜索當前網站內的資料。
精確搜索是關鍵字有加""引號，模糊搜索是不加引號。
>> http://notepad.cc/share/6FZRf3i2sE <<

Google翻譯當前網頁
就是一個整頁的Google翻譯，上方有一個比較精簡的置頂方條可以切換
翻譯結果和對比顯示原文和譯文。
>> http://notepad.cc/share/0zTHgu7zos <<

Google地圖反鏈相似快照
這個小書籤裡面包含有四個功能，因為這四個功能我都很少用，
除了地圖查詢偶而還會用到以外，所以為了節省書籤按鈕的空間，
我乾脆把四個功能合成一個，點下去網頁左上角會彈出功能選單，
可以從四個裡面挑一個來用。
這四個功能分別是：
用Google查找當前網頁的反向鏈接
用Google查找當前網頁的相似頁面
用Google查找當前網頁的網頁快照
用Google地圖查詢選取的地址位置
譬如說選取「台北市xxx路x段x號x樓」這段文字，會開一個新分頁以
Google Map顯示這個地址，如果沒有選取文字，則會要求輸入地址。
>> http://notepad.cc/share/tMujregnvm <<


Wikipedia搜索 (英文)
Wikipedia搜索 (中文)
VeryCD搜索
YouTube搜索
NicoNico搜索
........
以對應的站台搜索選取的文字。
以上搜尋都支援中文或日文等文字的輸入。
也可以自己改寫一下添加像是Yahoo搜索、拍賣搜索等等。
>> http://notepad.cc/share/bpKEtFxcWp <<


字典和翻譯類
我用的翻譯類工具好多喔......
我最常用的是 Google Translator Tooltip Expanded 
https://userscripts.org/scripts/show/150664
選取文字後會彈出一個小氣泡，滑鼠移到氣泡上會自動展開文字的翻譯結果，
可以選擇同時翻譯成二種語言，有聽取發音的功能，
不過直接連到google聽發音會被擋掉，要另外安裝修改Referrer的工具，
例如 Referrer Control(Fx) ，選擇移除Referrer，這樣就可以正常播放了。
Referrer Control同時可以顯示禁止外連網站的圖片，看圖不會看到叉燒包。
https://addons.mozilla.org/zh-tw/firefox/addon/referrer-control/

另一個是Fx專用的 uc腳本的Google翻譯，有選取文字的話點一下會嵌入翻譯
的文字在網頁的內文裡直接顯示，沒有選取文字會整頁翻譯。
由於 Google Translator Tooltip Expanded 彈出的氣泡在畫面邊邊的時候
會跑出畫面外而看不到，所以我拿這個翻譯腳本來補足。
還有一個這個翻譯腳本才能做到的功能，是可以在BBSFox裡面使用，
所以在ptt上也可以劃詞翻譯。
http://ppt.cc/-NZ5

其他一堆字典翻譯類的書籤小工具：
海詞詞典
劃詞翻譯，有音標和發音，有例句。

小D網頁劃詞
有英語、日語、法語、韓語四種辭典。

Bing劃詞翻譯
漢典『選字釋義』
Yahoo Dictionary: 英漢字典
Urban Dictionary: 英英字典
>> http://notepad.cc/share/LGWEdYz3R0 <<
開新分頁顯示選取的文字字典，
Urban可以查到很多正規字典裡面沒有的俚語用法。


TinEye Images
用TinEye搜尋比對當前網頁上的所有圖片。
感覺不是很好用的功能，我比較常用拖曳的方法，
把圖片往上拉會開一個前景分頁自動用Google以圖搜圖。
也有其他用Google以圖搜圖的bookmarklet可以選擇。

List Images
開一個新分頁直接排列顯示當前網頁上的所有圖片，同時顯示圖片的尺寸和位址。

List Large Images
同上，不過只列出大於設定尺寸的圖片，我是設為300x300。
>> http://notepad.cc/share/7wIAsK8ebI <<


滾動螢幕
自動向下滾動螢幕，調整scrollBy(0,2)的2這個數字1~10可以改變滾動的速度。

垂直分割視窗
水平分割視窗
將當前分頁以垂直或水平分割成二個並列的視窗顯示。
不知道有什麼用的功能....比對同頁內二段文字的差異？
>> http://notepad.cc/share/grwy7IU6Sk <<


Mouseover DOM Inspector
WhatFont
aardvark
查看檢測網頁的元素
>> http://notepad.cc/share/fuu45nGh7x <<


Design Bookmarklet
在網頁上顯示網格、尺標、量尺、座標定位，可以測量網頁上二點間距離的小工具。
這個小工具做得很美觀！

PrintWhatYouLike
列印前可以選擇要刪除網頁哪些區域、圖片、文字，只保留想要列印的部分。
>> http://notepad.cc/share/oXPUvhXpoj <<


還有其他列出CSS、表格排序、取色器等等的網頁開發的書籤小工具，
還有可以畫重點、記錄輸入的文字，儲存到雲端空間的bookmarklet，
不過我已經有裝Fx的快速筆記本擴展，所以這些功能我就沒有用。
其他bookmarklet可以參考以下的網頁：
http://www.ptt.cc/bbs/Browsers/M.1289163241.A.608.html
http://en.wikipedia.org/wiki/User:JesseW/BookmarkletsUniversal
http://lucifr.com/project/quix/


＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
除了滑鼠移動到書籤工具列上點擊，
這些書籤小工具有三個更快速啟動的方法，
第一個是利用瀏覽器為這些書籤設定關鍵字的功能，
例如Fx將「Google站內檢索」這個書籤設定關鍵字為 "g"
以後隨地按〔Alt〕＋〔D〕跳到網址列，再輸入 "g" 按〔Enter〕
就會啟動這個書籤，適合習慣使用鍵盤快速鍵的人。

第二個方法是直接用滑鼠手勢開啟書籤小工具，
譬如說用Fx的FireGestures滑鼠手勢擴展，
到官方網站把"Open Favorite URL"拉進「手勢對應」的設定裡，
http://www.xuldev.org/firegestures/
然後設定要開啟的書籤為指定的bookmarklet，
以後在原地畫滑鼠手勢就可以立刻開啟這些書籤功能，
適合習慣以滑鼠手勢取代一切操作的人。

第三個方法是利用Fx強大的uc腳本，自訂瀏覽器滑鼠右鍵開啟的選單，
把這些書籤小工具全部放到右鍵選單裡面，還可以為每個小工具
自訂美觀的圖示，以後瀏覽網頁到一半突然需要打開翻譯的功能，
直接右鍵選單就可以開啟，適合習慣使用強大右鍵功能選單的人。
http://ppt.cc/pBE1
圖例：直接加到右鍵選單的效果↓↓↓
http://i.minus.com/ih48E2yPTREIp.png

不過這個方法有一個缺點是啟動時Fx要全部載入這些書籤腳本，
我覺得書籤小工具好用的地方就在於平時不佔資源，
只是靜靜的躺在書籤工具列裡，等到要用的時候才啟動，
用完就關閉，非常乾淨又不浪費資源，
如果放到右鍵裡又會拖累一點點啟動的速度。


＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
還有通常不使用以上三種方法而是屬於直接點擊書籤工具列來使用的人，
例如我w
我都把要用的bookmarklet放到垂直的書籤工具列上，
由於這些bookmarklet預設沒有圖示，放到垂直書籤工具列上沒有文字說明
全部都是空白的圖示，很難搞清楚哪一個書籤是執行哪一個功能。
還有書籤資料夾也是，沒有獨立的圖示很難分清楚資料夾裡面放的是什麼，
所以這時候我們就會需要用到自訂樣式，來為這些沒有圖示的書籤資料夾
或者是書籤加上個別清楚的圖示來做區分。

可以使用瀏覽器自帶的userChrome.css或者是像Stylish等擴展，
來為書籤資料夾、書籤、BBSFox的書籤、標籤頁(例如ptt)加上圖示：
>> http://notepad.cc/share/BoOQGsjyRq <<

將圖示(PNG/ICO)轉為BASE64碼
http://www.askapache.com/online-tools/base64-image-converter/

加上圖示以後，這些bookmarklet其實就等於快捷的工具按鈕，
我計算過移動到工具列上點擊按鈕，和用畫手勢或按快速鍵或右鍵選單相比，
其實速度不會慢很多，由於我滑鼠手勢和快速鍵已經太多快記不住了，
取捨之下這些bookmarklet就還是乖乖的放在工具列上用點的就好w


--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 61.219.36.156
※ 文章網址: http://www.ptt.cc/bbs/Browsers/M.1398308943.A.BDD.html
※ 編輯: mayuyu (61.219.36.96), 04/24/2014 23:44:19
推 Soarwind:推，不錯
推 Kenqr:推!
推 FantasyNova:麻友友這麼厲害
推 examsystem:感謝分享
→ mayuyu:大家如果覺得實用的話今年總選舉請投麻友友一票w)
→ mayuyu:http://i.imgur.com/5mhLlCr.png
推 FantasyNova:一張不夠投 可以買兩張
推 mohiwa:大推。之前chrome有一些版本都失效,後來就沒再注意這個了
→ mohiwa:現在試了之後，發現又可以用bookmarklet了
→ mayuyu:有印象好像有一陣子是失效的 還有bookmarklet要在
→ mayuyu:有載入網頁的頁面才能使用 在空白新分頁下是不能用的
→ mayuyu:還有因為瀏覽器限制的關係 有用到http外連的bookmarklet
→ mayuyu:在https的頁面裡也是不能用的 chrome好像有一個設定可以
→ mayuyu:強制打開 不過現在不知道關了沒有 firefox我找不到方法
推 mohiwa:嗯嗯，謝謝釋疑。其實我最常的也只有解右鍵.又不想特地裝一
→ mohiwa:個套件.畢竟很多像這種的小小功能,真的只是偶爾會用到.這時
→ mohiwa:用bookmarklet就是最棒的了