すでに周知の事実かと思いますが、少なくとも自分は知らなかったのでまとめ。

Web開発におけるクロスブラウザ問題は、jQueyやPrototype.jsなどのJSライブラリを使うことで簡単に吸収できます。しかし事情により、使用を極力控えたい場合があるかもしれません。

  • 1サイト複数開発会社体制(ルール決めとかないとエラいことになる)とか
  • Webマスターが知らない間にライブラリ依存のJSコードを別ページに流用とか
  • しかもWebマスターが頻繁に変わる(流用が忘れ去られる)とか

prototype拡張でクロスブラウザ対応するとしたら

よりラッピング前の記法に近く、よりオブジェクト指向的(JavaScriptは厳密にはprotoytpeベースのオブジェクト指向ですが)な書き方をするとしたら、やはりprototype拡張を上手に駆使することではないでしょうか。
よくある例としてイベントアタッチ部分のクロスブラウザ対応を例にしてみます。独自でDOMオブジェクトにラッパーメソッドを定義するとした場合、大体の方は既存のクラスに対してこのように拡張することを考えるのでは。

// DOMContentLoadedやwindow.onloadまでサポートする場合は
// トップレベルオブジェクト(Object)に定義が必要(速度は二の次で)
Object.prototype.bind = function(e, f){
    this.addEventListener ?
    this.addEventListener(e, f, false) :
    this.attachEvent("on"+e, f);
};
document.getElementById("hoge").bind("click", function(){
    alert("clicked");
});

当方IE6、IE8、Firefox3.6で確認しましたが、Firefoxはまぁ順当ですね普通に動きました。しかし、IE系は「bind?なにそれ」と怒られてしまいました。恐らくChrome、Safari、Opera当たりも基本的にECMA仕様にのっとっていますから動くでしょうね。つまりIEだけがおかしい。

ちなみにObject以外で拡張をしたらどうなるか。イベントアタッチ対象が<button>とした場合を例にツリーを徐々に下げて(Object.prototype.bindの部分を置き換えて)確認したところ、結果は以下の通りでした。

  • Object…メソッドコール時に怒られる
  • Node…そもそもNodeなんていないと怒られる
  • Element…そもそもElementなんていないと怒られる
  • HTMLElement…そもそもHTMLElementなんていないと怒られる
  • HTMLButtonElement…そもそもHTMLButtonElementなんていないと怒られる

…いない?いないとはどういう事か。仮にツリー構造の通りにクラス名定義がされていないとしても何かしら生成元は存在するはず。早速身元確認をしてみる。

//<button id="hoge">があるとして
var hoge = document.getElementById("hoge");

alert(typeof hoge); //=> "object"
alert(hoge.constructor); //=> "undefined"

一応自分はobjectだと言ってくれた。でも親御さんはいないと主張している。いったいキミはどこから来たんだ…。
取り敢えずわかったことは、既存クラスにprototype拡張をしてもIEは「いない」か「つながってない」と言われるらしい。

不本意だが解決策はある

以下の方法だったら一応動かすことはできる。

var hoge = document.getElementById("hoge");

// パターン1:call(もしくはapply)メソッドを経由する
Object.prototype.bind = function(e, f){
    this.addEventListener ?
    this.addEventListener(e, f, false) :
    this.attachEvent("on"+e, f);
};
Object.bind.call(hoge, "click", function(){
    alert("clicked");
});

// パターン2:関数化する
function bind(o, e, f){
    o.addEventListener ?
    o.addEventListener(e, f, false) :
    o.attachEvent("on"+e, f);
}
bind(hoge, "click", function(){
    alert("clicked");
});

すげー負けた気分になるのは僕だけでしょうか…。
もしもっとスマートな案があれば教えてください。