当前位置:首页 > 行业动态 > 正文

html直接输出数据库数据

通过服务器端脚本(如PHP)连接数据库,执行查询后遍历结果集,将每条数据嵌入HTML标签动态生成页面内容

环境准备

使用PHP连接数据库并输出数据到HTML,需确保以下环境:

  1. Web服务器:如Apache/Nginx
  2. PHP环境:安装php-mysqli扩展(extension=mysqli
  3. 数据库:如MySQL,已创建数据表并插入数据

数据库连接与查询

通过PHP连接数据库并执行SQL查询,核心步骤如下:

// 连接数据库
$conn = mysqli_connect('localhost', '用户名', '密码', '数据库名');
if (!$conn) {
    die('连接失败: ' . mysqli_connect_error());
}
// 执行SQL查询
$sql = "SELECT id, name, age FROM users";
$result = mysqli_query($conn, $sql);

生成HTML表格

将查询结果转换为HTML表格结构:

echo "<table border='1'>";
echo "<tr><th>ID</th><th>姓名</th><th>年龄</th></tr>";
while ($row = mysqli_fetch_assoc($result)) {
    echo "<tr>";
    echo "<td>" . htmlspecialchars($row['id']) . "</td>";
    echo "<td>" . htmlspecialchars($row['name']) . "</td>";
    echo "<td>" . htmlspecialchars($row['age']) . "</td>";
    echo "</tr>";
}
echo "</table>";
// 释放资源
mysqli_free_result($result);
mysqli_close($conn);

完整示例代码

<!DOCTYPE html>
<html>
<head>数据库数据输出</title>
    <style>
        table { width: 50%; border-collapse: collapse; }
        th, td { border: 1px solid #666; padding: 8px; text-align: center; }
    </style>
</head>
<body>
    <?php
    // 连接数据库
    $conn = mysqli_connect('localhost', 'root', 'password', 'testdb');
    if (!$conn) {
        die('连接失败: ' . mysqli_connect_error());
    }
    // 查询数据
    $sql = "SELECT id, name, age FROM users";
    $result = mysqli_query($conn, $sql);
    if (mysqli_num_rows($result) > 0) {
        echo "<table>";
        echo "<tr><th>ID</th><th>姓名</th><th>年龄</th></tr>";
        while ($row = mysqli_fetch_assoc($result)) {
            echo "<tr>";
            echo "<td>" . htmlspecialchars($row['id']) . "</td>";
            echo "<td>" . htmlspecialchars($row['name']) . "</td>";
            echo "<td>" . htmlspecialchars($row['age']) . "</td>";
            echo "</tr>";
        }
        echo "</table>";
    } else {
        echo "无数据";
    }
    mysqli_free_result($result);
    mysqli_close($conn);
    ?>
</body>
</html>

常见问题与解答

问题1:如何改用PDO连接数据库?

解答
PDO是更通用的数据库扩展,支持多种数据库,修改代码如下:

try {
    $pdo = new PDO('mysql:host=localhost;dbname=testdb', 'root', 'password');
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $stmt = $pdo->query("SELECT id, name, age FROM users");
    // 后续处理与mysqli类似
} catch (PDOException $e) {
    die("连接失败: " . $e->getMessage());
}

问题2:如何给表格添加CSS样式?

解答
可通过以下方式美化表格:

  1. 内联样式:直接在<table>标签中添加style属性。
  2. 外部CSS:引入CSS文件或使用<style>标签定义样式。
  3. 框架:使用Bootstrap等框架,
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
    <table class="table table-striped">...</table>
0