dart - Dartにテーブル行を追加しますか？

Question

そこで、Dartから始めることにしました。データを含む新しいテーブル行を追加するための最良の方法は、すでに疑問に思っています。

HTMLで取得tbodyして使用してみましたが、存在しない場合などの問題があります。children.add()tbody

Answer 1

JavaScriptで新しいテーブル行を追加するとtbody、最後の行がない場合やどのように決定するかなどの問題が発生しますが、Dartでは簡単だと思います。

次に例を示します。

import 'dart:html';

main() {
  // Find the table.
  TableElement table = query('#foo');

  // Insert a row at index 0, and assign that row to a variable.
  TableRowElement row = table.insertRow(0);

  // Insert a cell at index 0, and assign that cell to a variable.
  TableCellElement cell = row.insertCell(0);
  cell.text = 'hey!';

  // Insert more cells with Message Cascading approach and style them.
  row.insertCell(1)
    ..text = 'foo'
    ..style.background = 'red';

  row.insertCell(2)
    ..text = 'bar'
    ..style.background = 'green';
}

また、行を最後まで挿入する場合は、次のように記述します。

table.insertRow(-1);

同じことが細胞にも当てはまります。