TOOLS-"Trixie": Customize Your Web Surfing

一直很羡慕FireFox上有各式各樣的外掛可以加,其中Greasemonkey是一直讓我流口水的功能之一。
(想知道Greasemonkey的神通廣大可以參考這裡 、這裡)

覺得某個網站的介面太鳥、功能太少,馬上可以自己動手改造成自己想要的樣子,這是多麼爽快的事。Greasemonkey提供了針對不同的網站/網頁時啟動專屬Javascript的功能,專屬的Javascript可以直接取存該網頁的DOM,用DHTML的技巧改變某個Element、或加上自己寫的華麗輔助UI。(換個角度想,你的網站如果都只靠Javascript來做安全管控,這下就慘了)

Trixie,就是寫給IE用的Greasemonkey!! 一部分寫給Greasemonkey的Script,甚至可以拿來直接用。關於Script的寫法,有份不錯的FAQ教學,熟悉Javascript又愛搞怪的朋友不用我講,現在已經開始動腦筋要如何應用這個強大的玩具了吧?

以下我就做個最簡單的示範。例如: 雖然我們都知道按著Shift點IE中的Link可以另開新視窗檢視,但有時連動雙手都覺得懶(例如另一手忙著拿筷子吃便當時),若直接在每個Link後方多加一個另開新視窗的Link,就可以省下按Shift的動作。如下圖,我就對Google的Search結果網頁做了手腳:

Script的寫法很簡單,安裝好Trixie,將這段Code另存成Blah.user.js到C:\program files\Bhelpuri\Trixie\Scripts預設就會被啟用。

// ==UserScript==
// @name          Google查詢結果以新視窗開啟
// @namespace     http://www.darkthread.net
// @description      為每一條Google查詢結果新增一個新視窗開啟的連結
// @include       http://www.google.com.tw/search*
// ==/UserScript==
(function()
{
    var hyperlinks = document.getElementsByTagName("a");
 
    for (var i = 0; i < hyperlinks.length; ++i)
    {
        var node = hyperlinks[i];
        if (node.className=="l") 
        {
            var newLink = document.createElement("a");
            newLink.href = node.href;
            newLink.target = "_blank";
            newLink.innerText = "【在新視窗檢視】";
            var newSpan = document.createElement("span");
            newSpan.style.fontSize = "9pt";
            newSpan.innerHTML = newLink.outerHTML;
            node.insertAdjacentElement("afterEnd", newSpan);
            newSpan.insertAdjacentText("beforeBegin", " ");
        }
    }
})();

光明面: 歡迎來到美麗新世界~~
黑暗面: 潘朵拉的盒子打開了~~~ (別再依賴Client-Script幫你做資安保全了!)

歡迎推文分享:
Published 06 June 2007 07:17 AM 由 Jeffrey
Filed under: , ,
Views: 23,847



意見

# 猛小董 said on 26 January, 2008 01:39 AM

http://www.gm4ie.com/

已有IE版的Greasemonkey

# CHE said on 28 December, 2008 10:38 PM

請問使用這個"Google查詢結果以新視窗開啟" SCRIPT 發現如果URL有中文字串,會轉成亂碼,應該是這一段程式碼發生問題 newLink.href = node.href;

可是我不知道要如何修改...

例如:GOOGLE 搜尋列輸入 "王建民 WIKI"

# Jeffrey said on 29 December, 2008 05:05 PM

to CHE, 我測試了一下,沒遇到所謂亂碼的狀況,看你要不要再提供多一點資訊。(例如: OS版本、IE版本、畫面範例等)

# CHE said on 29 December, 2008 08:32 PM

Jeffrey你好, 我的OS:XP SP3  IE:6.02900.5512 SP3

圖片:

cappella.k.googlepages.com/2008-12-30_113024.png

cappella.k.googlepages.com/2008-12-30_112837.png

# Jeffrey said on 30 December, 2008 03:34 AM

to CHE, 我的環境是IE7,測了IE6的確不行。我想問題應出在IE6對中文編碼的解析原則與IE7不同,我改了另一個寫法,在IE6上測過OK,供你參考:

... 略 ...

var fn = node.getAttribute("onmousedown").toString();

var href = fn.substring(fn.indexOf("'") + 1);

href = href.substring(0, href.indexOf("'"));

newLink.href = href;

... 略 ...

# CHE said on 30 December, 2008 03:54 AM

新的程式碼可以動了!!

感謝你的說明!!

# Ike said on 05 October, 2011 10:05 PM

請問…有沒有適用 IE9 的 UserScript 工具呢?

你的看法呢?

(必要的) 
(必要的) 
(選擇性的)
(必要的) 
(提醒: 因快取機制,您的留言幾分鐘後才會顯示在網站,請耐心稍候)

5 + 3 =

搜尋

Go

<June 2007>
SunMonTueWedThuFriSat
272829303112
3456789
10111213141516
17181920212223
24252627282930
1234567
 
RSS
創用 CC 授權條款
【廣告】
twMVC
最新回應

Tags 分類檢視
關於作者

一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

文章典藏
其他功能

這個部落格


Syndication