Ajaxを使用してHTMLで表を表示する方法

AjaxはHTMLテーブルとXMLデータを処理して、Webリーダー用のレコードのリストを表示します。 Ajaxでは、各HTML要素を定義する代わりに、テーブル関数を呼び出して、テーブル要素のコードを記述せずにレコードを行と列に表示できます。 AjaxはXMLから各データ項目をループ処理し、データを表示するか非表示にするかを選択します。

1。

テーブルを表示するために使用するHTMLファイルまたはAjaxファイルを右クリックします。 テーブルのデータを取得するために使用するXMLファイルを開きます。 次のAjaxステートメントは、顧客のリストを含むXMLファイルを開きます。

new Ajax.Request（ 'customers.xml'、{method： 'get'、onSuccess：function（transport）}

2。

タグのリストとタグのデータを取得します。 次のAjaxコードは、ループしてテーブルを作成するために使用するデータをロードします。

var customers = transport.responseXML.getElementsByTagName（ 'customer'）;

3。

各XML要素を反復処理する "for"ループを作成します。 次のコードは、Ajaxで "for"ループを設定する方法を示しています。

for（var i = 0; i <customers.length; i ++）{}

4。

データを表示するためのテーブル行とセルを作成します。 次のコードは、テーブル構造を設定する行変数とセル変数を作成します。

var row = $（ 'customers'）。insertRow（-1）; var cell = row.insertCell（-1）;

5。

テーブルのセルにデータを追加します。 次のコードは、顧客名をセルに追加します。

cell.innerHTML = customer;