Membaca kandungan pangkalan data dalam HTML melibatkan empat langkah: menghantar permintaan melalui JavaScript untuk mewujudkan sambungan pangkalan data. Gunakan pengendali acara onload untuk menghuraikan respons. Menghuraikan data berdasarkan jenis data, seperti JSON.parse() untuk menghuraikan JSON. Masukkan data yang dihuraikan ke dalam dokumen HTML menggunakan kaedah innerHTML atau appendChild().
Bagaimana membaca kandungan pangkalan data dalam HTML
Membaca kandungan pangkalan data dalam HTML melibatkan langkah -langkah berikut:
1. Objek XMLHttpRequest mewujudkan sambungan ke pangkalan data.
<code class="javascript">const request = new XMLHttpRequest(); request.open("GET", "database.php"); request.send();</code>
2 Mengendalikan responsXMLHttpRequest
对象建立与数据库的连接。
<code class="javascript">request.onload = function() { if (request.status === 200) { const data = request.responseText; // 解析并使用数据 } };</code>
2. 处理响应
当收到来自数据库的响应时,使用 XMLHttpRequest
对象的 onload
事件处理程序解析数据。
<code class="javascript">const dataObject = JSON.parse(data);</code>
3. 解析数据
根据数据库返回的数据类型解析数据。例如,如果数据为 JSON 格式,则可以使用 JSON.parse()
方法将其解析为 JavaScript 对象。
<code class="html"><table id="resultTable"></table></code>
4. 使用数据
解析数据后,可以使用它来更新 HTML 文档。可以使用 innerHTML
或 appendChild()
Apabila respons diterima daripada pangkalan data, gunakan pengendali acara onload
objek XMLHttpRequest
untuk menghuraikan data. <code class="javascript">const request = new XMLHttpRequest();
request.open("GET", "database.php");
request.onload = function() {
if (request.status === 200) {
const data = request.responseText;
const dataObject = JSON.parse(data);
// 创建表格行和单元格
for (let i = 0; i < dataObject.length; i++) {
const row = document.createElement("tr");
const cell1 = document.createElement("td");
const cell2 = document.createElement("td");
// 设置单元格内容
cell1.innerHTML = dataObject[i].id;
cell2.innerHTML = dataObject[i].name;
// 添加单元格和行到表格
row.appendChild(cell1);
row.appendChild(cell2);
document.getElementById("resultTable").appendChild(row);
}
}
};
request.send();</code>
JSON.parse()
untuk menghuraikannya ke dalam objek JavaScript. 🎜rrreee🎜🎜4. Menggunakan data🎜🎜🎜Selepas menghuraikan data, anda boleh menggunakannya untuk mengemas kini dokumen HTML. Data boleh dimasukkan ke dalam elemen HTML menggunakan kaedah innerHTML
atau appendChild()
. 🎜🎜🎜Contoh Kod🎜🎜🎜Berikut ialah contoh kod yang menunjukkan cara mendapatkan data daripada pangkalan data dan memaparkannya dalam jadual HTML: 🎜rrreeerrreeeAtas ialah kandungan terperinci Bagaimana untuk membaca kandungan pangkalan data dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!