2

私はjavascriptを初めて使用するので、そのことを前もって言っておきます。

私がよく使うWebサイトには、50ほどのアイテムがあり、そのアイテムの詳細がテーブルにあります。各テーブル行には、いくつかのtdセルが含まれています。一部の行には、USBドライブなど、類似したタイプのものがあります。各行をキャプチャして、好みに合わせてグループ化して並べ替えることができるようにします。

私はこのオブジェクトを持っています：

function vnlItemOnPage(){
  this.Category = "unknown";
  this.ItemClass = "vnlDefaultClass";
  this.ItemBlock = {};
}

これは1行を表します。

私が理解しようとしているのは、htmlのブロックをキャプチャしてに< tr>stuff< /tr>保存する方法this.ItemBlockです。

その部分は非常に簡単です。

vnlItemOnPage.ItemBlock = element.getElementByClassName('className')[0]

？

それはかなり簡単に思えます。私は何かが足りないのですか？

私が立ち往生しているこの部分：

それらは50個あるので、vnlItemOnPageの配列が必要ですか？

vnlAllItems = ???

var vnlAllItems = [vnlItemOnPage]?

そして、どのようにアレイに追加し、アレイから削除しますか？それが複雑な場合、私はおそらく配列から削除しないでしょう。気にしないでください。

<tr> htmlをキャプチャしたら、次のようにテーブル要素に追加できます。

myTable.appendChild(vnlAllItems[0].ItemBlock);

正しい？

私が間違った方向からこれに近づいていると思われる場合は、どんな提案も受け付けています。パフォーマンスは大きな問題ではありません-少なくとも今のところは。後で私は数百のアイテムのためにいくつかのページを統合しようとするかもしれません。

ご協力ありがとうございます！

[編集]

おそらく、質問の2番目の部分は非常に基本的なものであり、答えがわからないとは信じがたいです。

配列は次のようになります。var vnlAllItems = []

そして、それは次のとおりです。var row1 = new vnlItemOnPage; vnlAllItems.push（row1）; var row2 = new vnlItemOnPage; row2.ItemBlock = element.getElementByClassName（'className'）[0];

質問を閉じたいのですが、配列の処理について何もせずにそれを行うのは嫌です。

4

2 に答える 2

1

JQueryはここでのあなたの友達です。

これにより、目的のテーブルの本文の最初の行の内部HTMLが得られます。

var rowHtml = $('table#id-of-desired-table tbody tr:first').html() ;

外部HTMLを取得するには、jQuery拡張メソッドが必要です。

jQuery.fn.outerHTML = function() {
  return $('<div>').append( this.eq(0).clone() ).html();
};

使い方は簡単です：

var rowHtml = $('table#id-of-desired-table tbody tr:first').outerHtml() ;

楽しみ！

于 2011-05-20T20:50:04.133 に答える
1

それがあなたが探しているものであるかどうかはわかりませんが、テーブルの行を操作したい場合は、次のように格納します。

  • 行のhtml全体<td>1</td>...<td>n</td>を文字列として使用するため、行をすばやく再構築できます
  • 各行には実際のセル値が格納[1, ..., n]されているため、値を使用していくつかの操作を行うことができます（並べ替え）

行をhtmlとして取得するには、次を使用できます。

var rowHtml = element.getElementByClassName('className')[0].innerHTML;

セル値の配列を取得するには、次を使用できます。

var cells = [];
var cellElements = element.getElementByClassName('className')[0].cells;
for(var i=0;i<cellElements.length;i++) {
    cells.push(cellElements[i].innerText);
}

したがって、これらすべてを格納するオブジェクトは次のようになります。

function vnlItemOnPage(){
  this.Category = "unknown";
  this.ItemClass = "vnlDefaultClass";
  this.RowHtml = "";
  this.RowCells = [];
}
于 2011-05-20T22:29:56.273 に答える