1

DOMで必要に応じてグループまたはクラスを拡張したいのですが、すべての要素を拡張したくありません。可能です？

例えば：

document.getElementsByClass('extended').myMethod(); // working

しかし

document.getElementById('elementNotExtendedClass').myMethod(); // shouldnt be working

すべての要素を台無しにしたくないので、選択した要素だけです。おそらく、ドキュメントに独自のバージョンの createElement() メソッドを作成することで、何らかの形で行う必要があります。たとえば、document.CreateMyElement()。

または任意のアイデア？ありがとう

2006 年 6 月編集: プロトタイプ チェーンが機能し続けるソリューションを探しているので、共有メソッドとプロパティを一度に変更できます。

4

2 に答える 2

2

各インスタンスにメソッドを追加しない理由 ( fiddle )

function test() {
    this.style.fontWeight = "bold";
}

window.onload = function(){
    // add your method to existing elements with class 'extended'
    var elements = document.getElementsByClassName('extended');
    for (var i = 0; i < elements.length; i++){        
        elements[i].test = test;
    }
    // just to visualize what happened...
    var spans = document.getElementsByTagName("span");
    alert("span[0].test: " + typeof spans[0].test
          +"\nspan[1].test: " + typeof spans[1].test); 
    spans[0].test();
};
于 2012-06-01T20:16:31.863 に答える
0

アップデート

このアプローチでは、拡張メソッドを定義するグローバルインターフェイスを定義します。このようなインターフェイス内に配置すると、再適用せずにメソッドを変更できます。

MyExtendedInterface = {
    test: function() {
        // this points to the DOM element itself
        console.log(this);
    }
}

var elements = document.getElementsByClassName('extended');
for (var i = 0, el; el = elements[i]; ++i) {
    for (var j in MyExtendedInterface) {
        // bind the interface methods to the current element
        el[j] = MyExtendedInterface[j].bind(el);
    }
}

これ.bind()はJavaScriptに最近追加されたものです。参照：https ：//developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind

于 2012-06-03T10:18:17.063 に答える