データベースの内容をHTMLで読み取る方法

HTML でデータベースからコンテンツを読み取るには、JavaScript を通じてリクエストを送信してデータベース接続を確立するという 4 つの手順が必要です。 onload イベント ハンドラーを使用して応答を解析します。 JSON を解析するための JSON.parse() など、データ型に基づいてデータを解析します。 innerHTML または appendChild() メソッドを使用して、解析されたデータを HTML ドキュメントに挿入します。

#データベースの内容を HTML で読み取る方法

データベースの内容を HTML で読み取るには、次の操作が必要です。手順:

1. データベースへの接続

JavaScript の

XMLHttpRequest オブジェクトを使用して、データベースへの接続を確立します。

const request = new XMLHttpRequest();
request.open("GET", "database.php");
request.send();

2. 応答の処理

データベースから応答を受信するときは、

XMLHttpRequest## の onload イベントを使用します。 # object ハンドラーはデータを解析します。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>request.onload = function() { if (request.status === 200) { const data = request.responseText; // 解析并使用数据 } };</pre><div class="contentsignin">ログイン後にコピー</div></div>

3. データの解析

データベースから返されたデータ型に従ってデータを解析します。たとえば、データが JSON 形式の場合、

JSON.parse()

メソッドを使用してデータを JavaScript オブジェクトに解析できます。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>const dataObject = JSON.parse(data);</pre><div class="contentsignin">ログイン後にコピー</div></div></p>4. データの使用<p><strong></strong>データを解析した後、それを使用して HTML ドキュメントを更新できます。 </p>innerHTML<p> または <code>appendChild() メソッドを使用して、データを HTML 要素に挿入できます。

サンプル コード

次は、データベースからデータを取得して HTML テーブルに表示する方法を示すサンプル コードです。

以上がデータベースの内容をHTMLで読み取る方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。