噛み砕いて流れでご説明します。
実行される順番を考える
まず、実行される順番を理解しましょう。
PHPとJavaScriptでは、必ずPHPから実行されます。
なので、PHPのecho
やprint
で文字が表示された後、JavaScriptの処理になります。
今回やりたいことの整理
PHPの中に持っている変数を、table
に書き出していきたいという認識ですが、あっていますか?
ひとまず上記の認識で書いていきます。
先程の「実行される順番」から、PHPに持っている変数の数だけJavaScriptを実行すると言うのはいささか手際が悪いです。
PHP側で<tr><td></td></tr>
をecho
(またはprint
)した方がいい気がします。
しかし、やりたいのであれば仕方がない!
やろうじゃありませんか!!
出力したいPHPの変数分だけ、jQueryを出力する
先程の「実行される順番」から、どうあがいてもJavaScript側からPHPの変数にはアクセス出来ないことがわかりました。
(Ajaxという方法を使えばできなくはないですが、難易度が上がるので今回は言及しません。)
じゃあ、どうすればいいか?
出力したいPHPの変数分だけ、jQueryを出力すればいいんです!
さあ、やりましょうか。
PHP
1<?php
2
3# 予め、表示したいデータをPHPの配列に持っておきます
4$array = array(
5 1, 2, 3, 4, 5, 6, 7, 8, 9, 0
6);
7
8?>
9<html lang="ja">
10<head>
11 <!-- このページのタイトル -->
12 <title>hoge</title>
13
14 <!-- 文字コードはUTF8に -->
15 <meta charset="utf-8">
16
17 <!-- 「jQueryを使いますよ」という宣言 -->
18 <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
19</head>
20
21<body>
22
23 <!-- テーブルの基盤を用意しておきます。固有IDは「test」です -->
24 <table id="test" border="1">
25 <tr></tr>
26 </table>
27
28 <script>
29
30 <?php
31
32 # 変数$arrayの中身の数だけループします
33 foreach ($array as $key => $value) {
34 # 固有IDは「test」のなかのtrタグに追加していきます
35 echo '$("tr").append("<td>'. $value .'</td>");'."\n";
36 }
37
38 ?>
39
40 </script>
41
42</body>
43
44</html>
45
そうか、Cloud9でエラーチェックすれば良いのか(
修正しました