Laravel中PHP查询数据未正常渲染到HTML表格内部的问题

你遇到的内容全部渲染到表格外部的问题，核心原因是HTML标签书写错误：

• 标准HTML表格的普通单元格标签为<td>，表头单元格标签为<th>，你的代码里把所有单元格标签错写成了浏览器无法识别的<tb>。
• 浏览器解析DOM结构时，遇到<table>内部的非法标签，会自动将非法标签及其包裹的内容剥离到表格节点外部渲染，最终就出现了所有数据跑到表格前方的现象。
• 额外问题：你直接在视图模板中引入模型类、执行数据库查询的写法不符合Laravel的分层设计规范，会提升后续代码维护成本，也存在安全隐患。

1. 把所有错误的<tb>单元格标签替换为正确的<td>标签，仅做标签修正后的可运行原生PHP代码如下：

<table>
    <thead>
        <tr>
            <th>id</th>
            <th>merk</th>
            <th>type</th>
            <th>color</th>
            <th>price</th>
        </tr>
    </thead>
    <tbody>
        <?php
        use App\Models\Shoe;
        foreach (Shoe::all() as $shoe) { ?>
            <tr>
                <td> <?php echo $shoe->id ?> </td>
                <td> <?php echo $shoe->merk ?> </td>
                <td> <?php echo $shoe->type ?> </td>
                <td> <?php echo $shoe->color ?> </td>
                <td> <?php echo $shoe->price ?> </td>
            </tr>
        <?php } ?>
    </tbody>
</table>

2. 推荐按照Laravel最佳实践重构代码：

• 数据库查询逻辑放到控制器中完成，查询结果通过参数传递给视图，不要在视图文件里直接写模型查询：

// 对应路由的控制器方法，例如app/Http/Controllers/ShoeController.php的index方法
public function index()
{
    // 所有数据查询逻辑在控制器处理
    $shoes = Shoe::all();
    // 传递数据给视图模板
    return view('shoe.list', compact('shoes'));
}

• 视图文件使用Blade模板语法渲染，避免混写原生PHP，Blade自带的{{ }}输出语法会自动做XSS防护，代码更简洁安全：

<table>
    <thead>
        <tr>
            <th>id</th>
            <th>merk</th>
            <th>type</th>
            <th>color</th>
            <th>price</th>
        </tr>
    </thead>
    <tbody>
        {{-- Blade循环语法 --}}
        @foreach($shoes as $shoe)
        <tr>
            <td>{{ $shoe->id }}</td>
            <td>{{ $shoe->merk }}</td>
            <td>{{ $shoe->type }}</td>
            <td>{{ $shoe->color }}</td>
            <td>{{ $shoe->price }}</td>
        </tr>
        @endforeach
    </tbody>
</table>

提示：如果后续遇到表格内容错位、元素跑到表格外部的问题，优先检查表格嵌套标签是否合法，<table>下直接子节点只能是<thead>、<tbody>、<tfoot>、<colgroup>、<caption>等合法表格标签，行标签<tr>必须放在上述表格分区标签内部，单元格标签<td>/<th>必须直接放在<tr>内部。

内容的提问来源于stack exchange，提问作者Garb o' Donk