JavaScriptコードは、コアコードです:
関数SC(){ VAR mytableは=のdocument.getElementById( "mytableは"); //テーブル内のすべての行を取得します。 VAR行= myTable.rows。 //最初の行のすべての列を取得します。 VARタイトル=行[0] .cells。 VaRのJSON = ""; 以下のために(; I <rows.length; VAR iが1 = I ++){ VAR細胞=行[i]は.cells; i行目//取得すべての列 JSON + = "{"。 // JSON文字列アセンブリ 用(VARのJ = 0; J <cells.length; J ++){ JSON + = "\" "+タイトル[j]は.innerHTML +" \ "\" "+細胞[J] .innerHTML +" \ "" } //使用サブストリング()メソッドは、不要なカンマを削除し、必要な部分文字列を取得します JSON = json.substring(0、json.length-1)+ "}" } JSON = "[" + json.substring(0、json.length-1)+ "]"。 警告(JSON)。 }
HTMLコード
<テーブルID = "MYTABLE" クラス= "cart_table"> <TRクラス= "cart_title"> <TD> ID </ TD> <TD>タイトル</ TD> <TD>一価</ TD> </ TR> <TR> <TD> 1 </ TD> <TD> Cプログラミング言語</ TD> <TD> 50 </ TD> </ TR> <TR> <TD> 2 </ TD> <TD>並列プログラミング</ TD> <TD> 80 </ TD> </ TR> <TR> <TD> 3 </ TD> <TD> C#デザインモード</ TD> <TD> 100 </ TD> </ TR> </ TABLE> <入力タイプ= "ボタン" のonclick = "SC()" 値= "テーブルのデータがJSONを生成するGET" />
CSSスタイル
.cart_table { テキスト整列:センター; 国境崩壊:崩壊。 } .cart_title { 背景色:#999999; } TD { 国境:1pxの固体; }
データはJSON後に得られました
[{ "いいえ": "1"、 "タイトル": "Cプログラミング言語"、 "単価": "50"}、{ "いいえ": "2"、 "タイトル": "並列プログラミング" "価格": "80"}、{ "番号": "3"、 "タイトル": "C#のデザインモード"、 "単価": "100"}]