締切済み

HTMLのテーブルタグでCSVデータ表示

2022/05/07 21:18

HTML素人です。色々参考にしていますが、どうしてもわからず困っています。もし分かる方がいましたら、ご教示お願い致します。見よう見まねで下記のようなHTMLのテーブルを作成したのですが、この見出しの下のデータ部分から、指定の格納フォルダに保存しているCSVデータを読み込んで表示させるといったことがしたいです。（できれば、フォルダ内に新たにCSVデータが保存されたとき、一度読み込んだファイルの次から表示されるようにしたいです。）大変恐縮ですが、ご教示お願い致します。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>発注書</title> </head> <body> <header> <h1>発注書</h1> </header> </body> <table border> <tr> <th bgcolor="#00ffff">No</th> <th bgcolor="#00ffff">商品</th> <th bgcolor="#00ffff">商品名</th> <th bgcolor="#00ffff">数量</th> <th bgcolor="#00ffff">金額</th> <th bgcolor="#00ffff">合計金額</th> <th bgcolor="#00ffff">コメント</th> <th bgcolor="#00ffff">備考①</th> <th bgcolor="#00ffff">備考②</th> <th bgcolor="#00ffff">備考③</th> </tr> <tr> <td>2-1</td> <td>2-2</td> <td>2-3</td> <td>2-4</td> <td>2-5</td> <td>2-6</td> <td>2-7</td> <td>2-8</td> <td>2-9</td> <td>2-10</td> </tr> <tr> <td>3-1</td> <td>3-2</td> <td>3-3</td> <td>3-4</td> <td>3-5</td> <td>3-6</td> <td>3-7</td> <td>3-8</td> <td>3-9</td> <td>3-10</td> </tr> </table> </html>

tatata22
お礼率0% (0/12)

Visual Basic
回答数4
ありがとう数0

みんなの回答 （4）
専門家の回答

みんなの回答

imogasi
ベストアンサー率27% (4737/17069)

2022/05/09 11:58 回答No.4

小生はWEBページ作成は（その他も）、素人です。下記に個人的興味から、お遊び程度でやってみたこと、を記します。参考になれば。ローカルな環境で、自分のパソコンのＨＤに、自分のエクセル利用環境で、ファイルを作っただけです。プロからみれば笑われるかも。ただ完成には１日を要した。 HTML文はエラー箇所検出が苦労する。何か良いソフトでもあるのかな。ーーしかし、既出の回答でもおっしゃているように、プロはJavascriptなどで処理すると思われ、他にＣＳＳの機能利用などもあります。また普通、WEBページの作成には、市販のソフトを使うのだと思います。そのソフトでは、表の作成もサポートされているでしょう。その他必要関連知識も大変な量だと思います。またサーバーサイドで実行するのが普通でしょうが、それには、その環境の知識や経験が必要だと思います。ぜひ、良き指導者、プロ、スクール講師などから、大枠の進べき方向を学ぶ必要があると思います（どの方向がよいのか。言語、WEBページ作成ソフト、ツール、書籍など）。初心者の独りよがりの思い付きの延長ではなく、指導者が必要と思います。私は素人ですが、その点だけは挫折の経験などを踏まえ、判ります。世の中は、コンピューター処理は、日進月歩で、複雑化してゆき、コンピュータ処理を甘く見てはいけないと痛切に感じます。こんな質問コーナーの、二三の回答では済まされないことだと思います。＝＝＝＝＝＝サンプルデータ　CSVファイル 001,山本,23,東京都,写真 002,吉田,24,東京都,散歩 003,戸田,26,埼玉県,テレビ 004,今野,33,千葉県,パソコン 005,梅野,43,神奈川県,温泉ーーーー Vbscript　を使います。（"Scripting.FileSystemObject") インプットファイル名は、適宜質問者の場合に合わせて修正すること。アウトプットファイル名は、適宜質問者の場合に合わせて修正すること。ーーーー標準モジュールに Sub test02() Dim FSO As Object Dim fi As Object 'インプットファイル　Csvファイル Dim FO As Object 'アウトプットファイル　HTMLファイル Dim tx As Variant '------ Set FSO = CreateObject("Scripting.FileSystemObject") Set fi = FSO.OpenTextFile("C:\Users\xxxx\Documents\CSVデータ例２１０.csv") '---アウトプットファイルを再作成　テスト時でTry And Error時のため target = "C:\Users\惇\Documents\HTMLデータ例3.htm" If FSO.FileExists(target) Then MsgBox target & "が存在します。一旦抹消します。" FSO.DeleteFile target Else MsgBox target & "は存在しません。新規作成します。 " End If 'ーーアウトプットファイル再作成 strPath = "C:\Users\xxxx\Documents\HTMLデータ例3.htm" Set FO = FSO.CreateTextFile(strPath, ForWriting, TristateFalse) 'ーーーーテーブルHTMLの定義以前　の部分 FO.writeline "<!DOCTYPE html>" FO.writeline "<html>" FO.writeline "<head>" FO.writeline "<title>会員リスト</title>" FO.writeline "</head>" FO.writeline "<body>" FO.writeline "<table border =" & Chr(34) & "1" & Chr(34) & ">" '表を罫線ありに設定する '----表の項目見出し部=第１行目------- FO.writeline "<tr>" FO.writeline "<th>番号</th>" FO.writeline "<th>氏名</th>" FO.writeline "<th>年令</th>" FO.writeline "<th>住所</th>" FO.writeline "<th>趣味</th>" FO.writeline "</tr>" '----------主処理 Do Until fi.AtEndOfStream 'ファイル末尾まで繰り返し txt = fi.ReadLine '---表の途中の１行データ作成 FO.writeline "<tr>" '表の１行開始 tx = Split(txt, ",") For i = 0 To UBound(tx) FO.writeline "<td>" & tx(i) & "</td>" Next FO.writeline "</tr>" '表の１行終了 Loop 'ーーーー表のHTMLの定義以後　最終の部分 FO.writeline "</table>" FO.writeline "</body>" FO.writeline "</html> " 'ーーーーファイルのクローズ fi.Close 'インプットファイル（csv）のクローズ FO.Close 'アウトプットファイル（html）のクローズ End Sub ーーーーーその後、エクスプローラーを使って、上記アウトプットファイル（のアイコンや行）を画面に出して、それを選択し、右クリックし、プログラムから開く　ーー＞Microsoft Edgeで開く。すると、Ｅｄｇｅの画面に、表が現れるだろう。

Ultra-Hetare
ベストアンサー率38% (204/526)

2022/05/07 21:59 回答No.3

詳しく見ては居ませんが、取り敢えず、 </body>は </table>の後ろ </html>の前に記述するべきかと・・

asciiz
ベストアンサー率70% (6803/9674)

2022/05/07 21:37 回答No.2

ご希望の動作は、静的なHTML記述だけでは実現できません。動的なページ作成には、いくつかの方法があります。・JavaScriptプログラムを組み、CSVデータを呼んでTABLE要素に突っ込む。・CGIの仕組みを用いて、CSVデータを含んだHTML(TABLEタグ含む)を出力する。・HTML内にPHPプログラムを仕組み、TABLEタグ部分にデータを出力する。どの方法を使えるか、Webサーバの構築環境によっても違ってきます。とは言っても、JavaScriptであれば、HTML内に記述してWebサーバに置くだけですので、Webサーバ自体に特別な仕組みは必要ありません。(ただしCSVデータをhttpでアクセスできるフォルダに置く必要があります) CGIを使う場合、Webサーバで動く言語、perl・ruby・pythonと言った言語環境が用意されている必要がありますし、それぞれの言語向けのプログラムを作る必要があります。 PHPを使いたいならば、PHPが使えるWebサーバを用意する必要があります。まあ最近のレンタルWebサーバであれば、CGIでもPHPでも大概の物は使えるので、やり方を制限される心配はあまりないんですが。上記の言語のうち、何か出来ますか? (JavaScript・PHP・python・ruby・perl 等) あるいは、何を学習したいでしょうか?