2011年7月14日 星期四

Opera的User JavaScript

這是今年的學術稿XDD

有在玩Firefox的人應該都知道"GreaseMonkey"這個套件,它可以方便的在頁面中使用自定的JavaScript! Opera瀏覽器也有這種UserJS功能,只是強大的多XD

UserJS是什麼呢?其實就是一個JavaScript檔,只是是放在瀏覽器端,可以直接載入至頁面的JavaScript。利用UserJS控制頁面,我們可以做網頁上的各種功能、改寫網頁內容、CSS等等。 那接下來,我們來做99漫畫網(http://dm.99manga.com/)的調教(?

首先設定Opera,設定讀取UserJS的目錄。進入Opera後,按Ctrl+F12開啟設定視窗,Advanced -> Content -> JavaScript Options,在User JavaScript folder選擇存放UserJS的資料夾

那接下來就開始撰寫JavaScript吧。 首先是建立網站規則

// ==UserScript==
// @include http://dm.99manga.com/*
// ==/UserScript==

再來是清廣告。 經過觀察原始碼後,可以發現它的廣告是由JavaScript產生的,所以我們只要簡單的擋掉JavaScript即可

window.opera.addEventListener("BeforeScript",function(e){
   switch(e.element.src){
   case "http://dm.99manga.com/w/p1.js":
   case "http://dm.99manga.com/w/p2.js":
   case "http://dm.99manga.com/w/p3.js":
   case "http://dm.99manga.com/w/p4.js":
      e.preventDefault();
   }
},false);

頁面變的乾淨許多,但還有個廣告沒清掉,原來是iframe。

window.opera.addEventListener("BeforeEvent.load",function(e){
   e=e.event.target;
   if(e.nodeName=="IFRAME")
      e.parentNode.removeChild(e);
},false);

廣告清光光了lol。

那麼接下來加上快速鍵,讓瀏覽時更加的方便。當瀏覽至頁面頂、底時按PageUp、PageDn自動翻頁。 觀察原始碼,發現它是以nextpage()、prevpage()的函式進行翻頁的,那直接呼叫即可。

document.addEventListener("keypress",function(e){
   switch(e.keyCode){
   case 33:
      if(!document.documentElement.scrollTop)
      prevpage();
      break;
   case 34:
      if(document.documentElement.scrollTop
      +document.documentElement.clientHeight
      >=document.documentElement.scrollHeight)
      nextpage();
      break;
   }
},false);

以下給出完整程式碼

// ==UserScript==
// @include http://dm.99manga.com/*
// ==/UserScript==

window.opera.addEventListener("BeforeScript",function(e){
   switch(e.element.src){
   case "http://dm.99manga.com/w/p1.js":
   case "http://dm.99manga.com/w/p2.js":
   case "http://dm.99manga.com/w/p3.js":
   case "http://dm.99manga.com/w/p4.js":
      e.preventDefault();
   }
},false);

window.opera.addEventListener("BeforeEvent.load",function(e){
   e=e.event.target;
   if(e.nodeName=="IFRAME")
      e.parentNode.removeChild(e);
},false);

document.addEventListener("keypress",function(e){
   switch(e.keyCode){
   case 33:
      if(!document.documentElement.scrollTop)
      prevpage();
      break;
   case 34:
      if(document.documentElement.scrollTop
      +document.documentElement.clientHeight
      >=document.documentElement.scrollHeight)
      nextpage();
      break;
   }
},false);

對網頁頁面的調教其實對於寫網頁很有幫助!如果有空,可以試著調教yahoo,把它弄的和Google一樣(?

沒有留言:

張貼留言