PHP と MySQL はどのようにして JSON データを HTML 形式に変換しますか?
Web 開発では、PHP および MySQL を通じてバックエンドで取得したデータを HTML 形式でフロントエンド ページに表示する必要がよく発生します。一般的に使用されるデータ形式の 1 つは JSON です。この記事では、PHP と MySQL を使用して JSON データを HTML 形式に変換する方法と、対応するコード例を紹介します。
まず、データベースを準備し、対応するデータを保存する必要があります。 MySQL を例として、ユーザーの名前と年齢の情報を保存する「users」という名前のテーブルがあるとします。テーブルの構造は次のとおりです:
CREATE TABLE users (
id INT(11) AUTO_INCREMENT PRIMARY KEY, name VARCHAR(50) NOT NULL, age INT(3) NOT NULL
);
テスト データをテーブルに挿入します:
INSERT INTOユーザー (名前、年齢) VALUES ('Zhang San', 20);
ユーザー (名前、年齢) VALUES ('Li Si', 25);
ユーザー (名前、年齢) VALUES ( '王五' , 30);
PHP を使用してデータベースからデータを取得し、JSON 形式に変換します。
//データベースに接続します
$servername = "localhost";
$username = "root";
$password = "";
$ dbname = "test";
$conn = new mysqli($servername, $username, $password, $dbname);
// 接続が成功したかどうかを確認します
if ($ conn-> connect_error) {
die("连接失败: " . $conn->connect_error);}
// データベースからデータを取得
$sql = "SELECT * FROM users";
$result = $conn- >query($ sql);
// データを JSON 形式に変換します
$data = array();
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$data[] = $row;
}}
$jsonData = json_encode($data);
echo $jsonData;
// データベース接続を閉じる
$conn->close() ;
? >
上記のコードは、まずデータベースに接続し、「users」テーブルのデータを取得します。次に、ループを通じてデータの各行を配列に追加します。最後に、配列は json_encode() 関数によって JSON 形式に変換され、JSON 文字列が出力されます。
フロントエンド ページでは、JavaScript を使用してバックエンドから取得した JSON データを解析できます。 -end して変換します。 HTML テーブルに変換します。
<meta charset="UTF-8"> <title>JSON to HTML</title>
<table id="usersTable">
<thead>
<tr>
<th>ID</th>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script>
// 获取JSON数据
fetch('get_data.php')
.then(response => response.json())
.then(data => {
// 解析JSON数据并生成HTML表格
const tableBody = document.querySelector('#usersTable tbody');
data.forEach(row => {
const tr = document.createElement('tr');
tr.innerHTML = `
<td>${row.id}</td>
<td>${row.name}</td>
<td>${row.age}</td>
`;
tableBody.appendChild(tr);
});
});
</script>