Prototype Element.update multiple objects

Question

私はPrototypeのNew Element機能でテーブルを構築しようとしています。私は完全なコンテンツでtheadを更新していたときにFirefoxで問題を抱えていました。 Firefoxはタグを取り除き、内容だけを表示していました。

とにかく私はすべての1番目の要素を作成し、それをElement.update()関数を使ってtheadに追加することに決めました。しかし、私はこの機能で複数のオブジェクトを追加する方法を見つけていません。

番目の要素は次のようになります。

var thead_amount = new Element('th', { 
    'id': 'amount' 
}).update('amount'); 

これは正常に動作します：

new Element('thead').update(thead_amount); 

これは上記と同じ出力：

new Element('thead').update(thead_amount, thead_pdf, thead_tags, thead_date, thead_options); 

これは[object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement]

を出力

Prototypeのupdate()機能で複数のオブジェクトを追加するにはどうすればよいですか？

ありがとうございます！

Answer 1

編集

それはちょうどあなたが「THEAD」に「TH」の要素を追加していることを私に飛び出しました。これは悪いです！ THEADにはTRのみが含まれていなければなりません。 TRにはTHが含まれていますが、THEADを使用している場合は代わりにTDを使用します。

覚えておいてください：tbody、thead、およびtfootはテーブルの細区分であり、はtr要素を含むでなければなりません。あなたは結果を予測することができないので、tdやth要素を直接これらに入れるべきではありません。

エンド編集

ここでの問題は、Element.update（）は、文字列、HTMLスニペット、またはのtoString（例えば要素）を実装するJavaScriptオブジェクトを渡さなければならないことです。しかし、Elementはあなたが使用しているときに '+'演算子をサポートしておらず、あなたが見ているようにオブジェクト名をまとめています。あなたは明示的にそれぞれの子のtoStringメソッドを呼び出す必要があります：

new Element('thead').update(thead_amount.toString() 
    + thead_pdf.toString() 
    + thead_tags.toString() 
    + thead_date.toString() 
    + thead_options.toString()); 

アプリ（プロトタイプ拡張子）でscript.aculo.usを使用している場合は、あなたがより簡単に支援するためにビルダークラスを使用することができます要素の構築。はるかに直感的なインターフェイスを提供し、特に多数の要素を作成する場合に便利です。詳細については、アウトhttp://wiki.github.com/madrobby/scriptaculous/builder

var table = Builder.node('table', { 
    width: '100%', 
    cellpadding: '2', 
    cellspacing: '0', 
    border: '0' 
}); 

var tbody = Builder.node('tbody'), 
    tr = Builder.node('tr', { className: 'header' }), 
    td = Builder.node('td', [Builder.node('strong', 'Category')]); 

tr.appendChild(td); 
tbody.appendChild(tr); 
table.appendChild(tbody); 

$('divCat').appendChild(table); 

チェック：ここでは一例です。