[Laravel 6.x]Route::get()で設定したURLパラメーターの取得
Laravel6.xでRoute::get('/path/to/{id}')で設定したidの取得方法について。
HOME>WEBプログラム覚書>JavaScriptでテーブルの行を交互に色分け[テーブル複数ある場合]
JavaScriptでテーブルの行を交互に色分け[テーブル複数ある場合]
昨日のエントリーで書いてあるのはテーブルが複数あった場合、ページ内のtrを一まとめで取得するのでちょっと困ることがある。なんでテーブルが複数あってもテーブルごとにtrを取得するように変更。
また確認して気が付いたのだが背景色指定がFirefoxで利いてなかったのでクラス名を振ってCSSで背景色指定の方がよさそうだ。
Javascript
- window.onload = TrColor;
- function TrColor(){
- // ページ内のテーブルを取得
- var table = document.getElementsByTagName("table");
- for(i=0; i<table.length; i++){
- tr = table[i].getElementsByTagName("tr");
- for(j=0; j<tr.length; j++){
- // 偶数の時
- if (j % 2 == 0) {
- tr[j].className = "trColor";
- }
- }
- }
- }
HTML
- <h5>サンプルテーブル</h5>
- <table>
- <tr>
- <th>JavaScript</th>
- <td>ジャバスクリプト</td>
- </tr>
- <tr>
- <th>ＰＨＰ</th>
- <td>ピーエイチピー</td>
- </tr>
- <tr>
- <th>MySQL</th>
- <td>マイエスキューエル</td>
- </tr>
- <tr>
- <th>ＸＭＬ</th>
- <td>エックスエムエル</td>
- </tr>
- <tr>
- <th>CSS</th>
- <td>シーエスエス</td>
- </tr>
- </table>
- <h5>サンプルテーブル2</h5>
- <table>
- <tr>
- <th>JavaScript</th>
- <td>ジャバスクリプト</td>
- </tr>
- <tr>
- <th>ＰＨＰ</th>
- <td>ピーエイチピー</td>
- </tr>
- <tr>
- <th>MySQL</th>
- <td>マイエスキューエル</td>
- </tr>
- <tr>
- <th>ＸＭＬ</th>
- <td>エックスエムエル</td>
- </tr>
- <tr>
- <th>CSS</th>
- <td>シーエスエス</td>
- </tr>
- </table>
実行結果
最初なぜかgetElementsByTagName()でtrが取得できなかったので回りくどいのを書いていた。これはこれで何かに使えそうなのでメモ
Javascript
- function TrColor(){
- // ページ内のテーブルを取得
- var table = document.getElementsByTagName("table");
- for(i=0; i<table.length; i++){
- // テーブルにIDをセット
- table[i].setAttribute("id", "tb" + i);
- // IDでテーブル取得
- tableAtt = document.getElementById("tb" + i);
- // 取得したテーブルのtrを取得
- tr = tableAtt.getElementsByTagName("tr");
- for(j=0; j<tr.length; j++){
- // 偶数の時
- if (j % 2 == 0) {
- tr[j].className = "trColor";
- }
- }
- }
- }
| 投稿日 | 2007年9月19日 12:59 |
|---|---|
| カテゴリ | JavaScript |
| タグ | インターフェイス | サンプルコード |
| トラックバック URL | http://www.kantenna.com/cgi-bin/mt504/mt-tb.cgi/1093 |
コメント