やりたいこと
- HTMLのテーブルを作りたい
- テーブルの行がすごく多い
- 仕様変更によって行の内容が変わる可能性が大きい
- 列は決まっている
- 本当はJSPを作りたいので変数名なんかを間に入れ込んだりする
- 諸事情により既存のべた書き方法は変えられない
本音 : 面倒くさいことはやりたくない
地道に書くのも地道に修正するのも面倒くさい
HTMLのテーブルを作る方法
1. テーブルの1行に使う文字郡を作る
- 仕様書などからExcelなどでスペース区切りにして文字列を結合する
- シングルクォーテーション(')かダブルクォーテーション(")で囲む
(サンプル)
'くま もり peachpuff'
'ねこ まち lightpink'
2. bashでshellを作る
- で作った1行に使う文字郡は配列にベタッと貼る
htmlMaker.sh
#!/bin/bash
dataArray=(
'くま もり peachpuff'
'ねこ まち lightpink'
'さる 上野動物園 burlywood'
'りす 鎌倉 khaki'
'魚 海 lightblue'
)
fileName='Table.html'
echo '<html>' > $fileName
echo '<table bordercolor="black">' >> $fileName
echo '<tr>' >> $fileName
echo '<th>動物</th>' >> $fileName
echo '<th>居場所</th>' >> $fileName
echo '</tr>' >> $fileName
for i in "${dataArray[@]}"; do
data=(${i[@]})
animal=${data[0]}
place=${data[1]}
color=${data[2]}
echo '<tr>' >> $fileName
echo '<td bgcolor="'$color'">'$animal'</td>' >> $fileName
echo '<td bgcolor="'$color'">'$place'</td>' >> $fileName
echo '</tr>' >> $fileName
done
echo '</table>' >> $fileName
echo '</html>' >> $fileName
3. シェルを動かしてHTMLを出力してもらう
Table.html
<html>
<table bordercolor="black">
<tr>
<th>動物</th>
<th>居場所</th>
</tr>
<tr>
<td bgcolor="peachpuff">くま</td>
<td bgcolor="peachpuff">もり</td>
</tr>
<tr>
<td bgcolor="lightpink">ねこ</td>
<td bgcolor="lightpink">まち</td>
</tr>
<tr>
<td bgcolor="burlywood">さる</td>
<td bgcolor="burlywood">上野動物園</td>
</tr>
<tr>
<td bgcolor="khaki">りす</td>
<td bgcolor="khaki">鎌倉</td>
</tr>
<tr>
<td bgcolor="lightblue">魚</td>
<td bgcolor="lightblue">海</td>
</tr>
</table>
</html>
4. 見てみる
このやり方の欠点
スペースがある文字列が使えない
誰かいい方法を教えて下さい。
この方法に辿りつくまでの失敗
初心者過ぎてbashで多次元配列は工夫しないとできないことを知らなかった
dataArray=(
('くま' 'もり' 'peachpuff')
)
こう書いて怒られた・・・
$ bash htmlMaker.sh
htmlMaker.sh: line 4: syntax error near unexpected token `('
htmlMaker.sh: line 4: ` ('くま' 'もり' 'peachpuff')'
htmlMaker.sh: line 9: syntax error near unexpected token `)'
htmlMaker.sh: line 9: `)'
だから[BASHで二次元配列][]のやり方をベースに考えることにした
[BASHで二次元配列]:http://kiyohime.hatenablog.com/entry/2013/12/09/193729
配列の展開方法を知らなかった
for i in $dataArray; do
data=$i
animal=$data[0]
place=$data[1]
color=$data[2]
<省略>
done
こう書いてこうなった
<html>
<table bordercolor="black">
<tr>
<th>動物</th>
<th>居場所</th>
</tr>
<tr>
<td bgcolor="くま[2]">くま[0]</td>
<td bgcolor="くま[2]">くま[1]</td>
</tr>
<tr>
<td bgcolor="もり[2]">もり[0]</td>
<td bgcolor="もり[2]">もり[1]</td>
</tr>
<tr>
<td bgcolor="peachpuff[2]">peachpuff[0]</td>
<td bgcolor="peachpuff[2]">peachpuff[1]</td>
</tr>
</table>
</html>
[配列を使用する][]で勉強して修正した
[配列を使用する]:http://shellscript.sunone.me/array.html#配列の要素を参照する
ダブルクォーテーション(")で配列をくくる必要性を知らなかった
for i in ${dataArray[@]}; do
data=$i
animal=${data[0]}
place=${data[1]}
color=${data[2]}
<省略>
done
こう書いてこうなった
<html>
<table bordercolor="black">
<tr>
<th>動物</th>
<th>居場所</th>
</tr>
<tr>
<td bgcolor="">くま</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">もり</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">peachpuff</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">ねこ</td>
<省略>
<td bgcolor="">lightblue</td>
<td bgcolor=""></td>
</tr>
</table>
</html>
[【bash】シェルの配列について][]のサイトで教えてもらってなおした
[【bash】シェルの配列について]:http://www.task-notes.com/entry/20150119/1421646435
配列の中にある配列を抜く方法がわかっていなかった
for i in "${dataArray[@]}"; do
data=$i
<省略>
done
こう書いてこうなった
<html>
<table bordercolor="black">
<tr>
<th>動物</th>
<th>居場所</th>
</tr>
<tr>
<td bgcolor="">くま もり peachpuff</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">ねこ まち lightpink</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">さる 上野動物園 burlywood</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">りす 鎌倉 khaki</td>
<td bgcolor=""></td>
</tr>
<tr>
<td bgcolor="">魚 海 lightblue</td>
<td bgcolor=""></td>
</tr>
</table>
</html>
こうやっても結果は同じだった
for i in "${dataArray[@]}"; do
data=${i[@]}
<省略>
done
bashの気持ちをおトイレで考えて思いついて修正した