クラスを事前にメソッドを指定せずにメソッドを受け入れる方法を教えてください。

Question

私はこのようなものがある場合：

function foo(class){ 
    for(i=0; i<(class.length);i++){ 
     return document.getElementsByClassName(class)[i]; 
    } 
} 

そして今、私はこのような何かをしたい：

foo("someclass").innerHTML="something"; 

をそれが最初の要素だけのためにそれを行うだろうし、この問題が発生し、どのように、なぜ私は理解してそれが正常に動作しますが、私は機能を作ることができるか、もしそうであればこの

foo("someclass").innerHTML="something";//this to put something inside the element 
    foo("someclass").style.backgroundColor="#000");// and this to work also 

のように、正確に何を行うにはループの中で、それを伝えることなく、他の方法を取得するにはその可能性は、どのように私はfoo関数のループでこれらのメソッドを入れないで、これを行うことができますか？この

function foo(class).variableMethod{ 
for(i=0; i<(class.length);i++){ 
    document.getElementsByClassName(class)[i].variableMethod; 
} 

}

のような変数にこれらのメソッドを置く方法はあります、これは可能ですか？

Answer 1

あなたはfoo()に関数を渡すと、一致する各要素と機能foo()コール持つことができます。ただ、他に追加する

foo("someclass", function(element) { 
    element.innerHTML = "something"; 
    element.style.backgroundColor = "#000"; 
}); 

Answer 2

：

function foo(className, func) 
{ 
    var elements = document.getElementsByClassName(className); 
    for (var i = 0; i < elements.length; ++i) { 
     func(elements[i]); 
    } 
} 

今、あなたのような何かを行うことができますがここでの大きな回答は、innerHtmlというオーバーライドメソッドで作成することです。必要に応じて、単一のインスタンスとopperateだけでなく、コレクションのinnerHtmlチェックを行うことができます。

UPDATE

は、ここでの方法チェーンの簡単な例です。ここでは、基本的にタグ名に基づいて要素のコレクションを取得し、JavaScriptのprototypeオブジェクトを使用して作成したval（）メソッドを使用してその値を設定します。

function Foo(tagName) 
{ 
    this.collection = document.getElementsByTagName(tagName); 
    return this; 
} 

Foo.prototype.val= function(value){ 

    for(var i = 0; i < this.collection.length; i++) 
    { 
     this.collection[i].innerHTML = value; 
    } 
} 


var x = new Foo("li").val("Hello World"); 

あなたはここでこの作業のデモを見ることができます：http://jsfiddle.net/E48ym/1/

Answer 3

Frédéric Hamidi's answerあなたは私が考えてやりたいだろうが、あなたはまた、jQueryのようなフレームワークを使用することができます - これは、それが設計されたものの一種でありますために。だから、何ができる：

$('.className').text('something'); 

をclassNameのクラスを持つすべての要素の背景色を変更するclassNameに何かのクラスを持つすべての要素のテキスト、または

$('.className').css('background-color', '#000'); 

を設定します。