HTML与数据库查询的协同效应

HTML melengkapkan pertanyaan pangkalan data, membolehkan pembinaan aplikasi web interaktif dan dipacu data: Pemprosesan borang HTML: mengumpul input pengguna dan mendapatkan semula data daripada pangkalan data, bertindak balas kepada operasi pengguna. Permintaan data AJAX: Hantar pertanyaan pangkalan data secara tidak segerak, kemas kini data tanpa memuat semula halaman. Fungsi carian dipacu pangkalan data: Pengguna memasukkan pertanyaan dan aplikasi menggunakan SQL untuk menanyakan pangkalan data untuk mengembalikan hasil yang berkaitan.

Sinergi HTML dan pertanyaan pangkalan data

Pengenalan

HTML dan pertanyaan pangkalan data saling melengkapi dan membantu kami membina aplikasi web interaktif dan dipacu data. Artikel ini meneroka cara menggabungkan HTML dengan pertanyaan pangkalan data dan menyediakan beberapa contoh praktikal.

1. Pemprosesan borang HTML

Borang HTML boleh digunakan untuk mengumpul input pengguna. Kami boleh menggunakan bahasa bahagian belakang seperti PHP, Python atau Node.js untuk memproses borang ini dan mendapatkan semula data yang diperlukan daripada pangkalan data sebagai tindak balas.

Contoh Kod:

<!-- HTML 表单 -->
<form action="process.php" method="post">
  <input type="text" name="name" placeholder="姓名">
  <input type="email" name="email" placeholder="电子邮箱">
  <input type="submit" value="提交">
</form>

<!-- PHP 表单处理 -->
<?php
// 从表单中获取数据
$name = $_POST['name'];
$email = $_POST['email'];

// 连接数据库
$conn = new mysqli('localhost', 'root', '', 'mydb');

// 准备 SQL 查询
$stmt = $conn->prepare("SELECT * FROM users WHERE name=?");
$stmt->bind_param('s', $name);

// 执行查询并获取结果
$stmt->execute();
$result = $stmt->get_result();

// 遍历结果并显示用户数据
while ($row = $result->fetch_assoc()) {
  echo "姓名：" . $row['name'] . "<br>";
  echo "电子邮箱：" . $row['email'] . "<br>";
}
?>

2. AJAX Data Request

AJAX (Asynchronous JavaScript and XML) boleh digunakan untuk menghantar pertanyaan ke pangkalan data tanpa memuat semula keseluruhan halaman. Ini membolehkan kami mengemas kini data tanpa mengganggu pengalaman pengguna.

Contoh kod:

<!-- HTML 页面 -->
<div id="data"></div>

<!-- JavaScript AJAX 调用 -->
<script>
// 创建 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();

// 设置请求方法和 URL
xhr.open('GET', 'get_data.php');

// 发送请求
xhr.send();

// 处理响应
xhr.onload = function() {
  if (xhr.status == 200) {
    var data = JSON.parse(xhr.responseText);
    // 使用接收到的数据更新 HTML 元素
    document.getElementById('data').innerHTML = data.message;
  }
};
</script>

<!-- PHP 获取数据 -->
<?php
// 连接数据库
$conn = new mysqli('localhost', 'root', '', 'mydb');

// 准备 SQL 查询
$stmt = $conn->prepare("SELECT * FROM messages");

// 执行查询并获取结果
$stmt->execute();
$result = $stmt->get_result();

// 将结果编码为 JSON 并返回
$messages = [];
while ($row = $result->fetch_assoc()) {
  $messages[] = $row;
}
echo json_encode(['message' => $messages]);
?>

3. Fungsi carian dipacu pangkalan data

Kami boleh membina fungsi carian dipacu pangkalan data dengan menggabungkan pertanyaan HTML dan pangkalan data. Pengguna memasukkan pertanyaan dan aplikasi menggunakan SQL untuk menanyakan pangkalan data dan mengembalikan hasil yang berkaitan.

Contoh Kod:

<!-- HTML 搜索栏 -->
<input type="text" id="search">

<!-- JavaScript 搜索处理 -->
<script>
// 获取搜索栏输入
var searchTerm = document.getElementById('search').value;

// 使用 AJAX 发送查询
var xhr = new XMLHttpRequest();
xhr.open('GET', 'search.php?q=' + searchTerm);
xhr.send();

// 处理响应
xhr.onload = function() {
  if (xhr.status == 200) {
    var results = JSON.parse(xhr.responseText);
    // 使用接收到的结果更新 HTML 元素
    // ...
  }
};
</script>

<!-- PHP 搜索 -->
<?php
// 获取搜索查询
$q = $_GET['q'];

// 连接数据库
$conn = new mysqli('localhost', 'root', '', 'mydb');

// 准备 SQL 查询
$stmt = $conn->prepare("SELECT * FROM products WHERE name LIKE ?");
$stmt->bind_param('s', $q);

// 执行查询并获取结果
$stmt->execute();
$result = $stmt->get_result();

// 将结果编码为 JSON 并返回
$products = [];
while ($row = $result->fetch_assoc()) {
  $products[] = $row;
}
echo json_encode(['results' => $products]);
?>

Kesimpulan

HTML berfungsi dengan pertanyaan pangkalan data untuk menyediakan alatan berkuasa untuk membina aplikasi web interaktif dan dipacu data. Dengan menyepadukan teknologi ini, kami boleh mencipta halaman dinamik dan interaktif yang boleh mengambil, memproses dan memaparkan data daripada pangkalan data.

Atas ialah kandungan terperinci HTML与数据库查询的协同效应. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!