9/9/2005 GreaseMonkey is so cool

::-- ZoomQuiet [2005-09-09 04:03:02]

• 在developerworks看文档的时候，style里定义的Code字体太小（code{ font-family: Courier, monospace; font-size: +2; }），刚开始看的时候还以为那是个下划线 再看发现那里应该是有内容的，否则文章连贯不起来，放大了无数倍之后，才发现居然真的有字 只好从菜单“工具－DOM查看器”，修改StyleSheets中Code的字体；换页之后发现那个Css是附带在每个页面当中的，每换一页都要修改一次，着实麻烦，于是就想到了GreaseMonkey。没想到的是，利用JS修改全局Css又费了一番功夫，好在终于成功了

• IBMEditStyleCode.user.js

  // IBM Develop's stye Code font size is two small,so change it
  // version 0.1 BETA!
  // 2005-09-08
  // Copyright (c) 2005, Weide
  // Released under the GPL license
  // http://www.gnu.org/copyleft/gpl.html
  //
  // --------------------------------------------------------------------
  //
  // This is a Greasemonkey user script.  To install it, you need
  // Greasemonkey 0.5.3 or later: http://greasemonkey.mozdev.org/
  // Then restart Firefox and revisit this script.
  // Under Tools, there will be a new menu item to "Install User Script".
  // Accept the default configuration and install.
  //
  // To uninstall, go to Tools/Manage User Scripts,
  // select @name(see follow), and click Uninstall.
  //
  // --------------------------------------------------------------------
  //
  // ==UserScript==
  // @name          IBM Edit Sytle Code
  // @namespace     http://spaces.msn.com/members/weide/
  // @description   Edit IBM Develop's style code
  // @include       *.ibm.com*
  // ==/UserScript==
  
  // You may find more functions at:
  // http://developer.apple.com/internet/webcontent/styles.html
  
  
  var ugly_selectorText_workaround_flag = false;
  var allStyleRules;
  
  
  String.prototype.trim = function(){
     return this.replace(/(^\s+)|\s+$/g,"");
  }
  
  String.prototype.isEquals = function(str) {
      return this.toLowerCase() == str.toLowerCase();
  }
  
  function ugly_selectorText_workaround() {
          if((navigator.userAgent.indexOf("Gecko") == -1) ||
             (ugly_selectorText_workaround_flag)) {
                  return; // we've already been here or shouldn't be here
          }
          var styleElements = document.getElementsByTagName("style");
          
          for(var i = 0; i < styleElements.length; i++) {
                  var styleText = styleElements[i].firstChild.data;
                  // this should be using match(/\b[\w-.]+(?=\s*\{)/g but ?= causes an
                  // error in IE5, so we include the open brace and then strip it
                  allStyleRules = styleText.match(/\b[\w-.]+(\s*\{)/g);
          }
  
          for(var i = 0; i < allStyleRules.length; i++) {
                  // probably insufficient for people who like random gobs of 
                  // whitespace in their styles
                  allStyleRules[i] = allStyleRules[i].substr(0, (allStyleRules[i].length - 2)).trim();
          }
          ugly_selectorText_workaround_flag = true;
  }
  
  // setStyleByTag: given an element type, style property and
  // value, and whether the property should override inline styles or
  // just global stylesheet preferences, apply the style.
  // args:
  //  e - element type or id
  //  p - property
  //  v - value
  //  g - boolean 0: modify global only; 1: modify all elements in document
  function setStyleByTag(e, p, v, g) {
      e=e.trim();
      if(g) {
          var elements = document.getElementsByTagName(e);
          for(var i = 0; i < elements.length; i++) {
              elements.item(i).style[p] = v;
          }
      } else {
          var sheets = document.styleSheets;
          if(sheets.length > 0) {
              for(var i = 0; i < sheets.length; i++) {
                  var rules = sheets[i].cssRules;
                  if (! ( rules ) ) rules = sheets[i].rules;
                  if(rules.length > 0) {
                      for(var j = 0; j < rules.length; j++) {
                          var s = rules[j].style;
                          // selectorText broken in NS 6/Mozilla: see
                          // http://bugzilla.mozilla.org/show_bug.cgi?id=51944
                          ugly_selectorText_workaround();
                          if(allStyleRules) {
                              if(allStyleRules[j].isEquals(e)) {
                                  s[p] = v;
                              }           
                          } else {//alert(rules[j].selectorText+e+s.fontsize);
                              // use the native selectorText and style stuff
                              if (rules[j].selectorText.isEquals(e)){ //(((s[p] != "") && (s[p] != null)) &&(rules[j].selectorText.isEquals(e))) {
                                  s[p] = v;
                              }
                          }
  
                      }
                  }
              }
          }
      }
  }
  
  setStyleByTag('code','font','12px  Courier, monospace',0)

  • 具有良好插件结构(扩展机制)的软件是令人舒服的，FireFox即是其中一款。GreaseMonkey是FireFox的一个扩展，可以执行JavaScript脚本，为页面增加许多实用功能。 Greasemonkey 提供全自动化的服务，帮你 Match Domain，自动执行 User scripts，加强管理。Greasemonkey的出现从本质冲击了我们对浏览器的使用概念，通过浏览器对网页执行本地脚本程序，控制网页的呈现方式，添加功能。其实Greasemonkey本身并没有多么的显眼，因为他的功能完全类似于一个基础设施，所以，看不出他能干什么。他是一个中间的承载器件，要是把各种JavaScript脚本语言加载上去，那功能就太丰富多彩了。 对于软件架构方面的启发就是：Kernel+插件容器(包含插件辅助工具)+插件。Kernel 是最底层的运行支撑，提供最基本的功能支持，设计要求为“简单、稳定”；插件机制提供了系统足够的扩展能力，插件将提供用户需要的业务功能；插件容器既作为插件的载体和管理工具，同时提供插件辅助工具，可以通过脚本语言如JavaScript或Python利用Kernel、插件提供的接口方便地扩展新的应用，插件辅助工具更多地应用在高层业务逻辑或表现层上，大大增加了系统的灵活性。这种模式并不是创新，事实上很多大型软件就采用了这种方式。目前对于为应用程序添加Javascript或Python脚本的扩展接口，尚未有完整的解决办法，继续学习中……

参考链接：

• http://wiki.woodpecker.org.cn/moin/Greasemonkey

• http://xerdoc.com/blog/archives/198.html