console 命令行工具 X clear

console

// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();

// 发送AJAX请求
xhr.open('GET', 'your_php_file.php', true);
xhr.onload = function () {
    if (xhr.status >= 200 && xhr.status < 300) {
        var data = JSON.parse(xhr.responseText);
        var table = document.createElement('table');
        data.forEach(function(row) {
            var tr = table.insertRow();
            Object.values(row).forEach(function(value) {
                var td = tr.insertCell();
                td.textContent = value;
            });
        });
        document.body.appendChild(table);
    } else {
        console.error('请求失败');
    }
};
xhr.send();

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style>
    ul{
            margin:0;
            padding:0;
            list-style-type:none;
            background-color:#333;
            overflow:hidden;
            border-radius: 15px 15px 15px 15px;
    }
    li{
        float:left;
        border-right:2px solid red;

    }
    li:last-child{border-right:none;}
    li a{
        text-align:center;
        padding: 14px 16px;
        display:block;
        text-decoration: none;
        color: white;
        border-radius: 15px 15px 15px 15px;
    }
    li a:hover{
        background-color:#111;
    }

        </style>
</head>
<body>
           <ul>
            <li><a class="active" href="index.html">首页</a></li>
            <li><a href="index.html">关于</a></li>
           </ul>

<table>
        <tr>
            <th>列1</th>
            <th>列2</th>
            <th>列3</th>
        </tr>
        <tr>
            <td>数据1</td>
            <td>数据2</td>
            <td>数据3</td>
        </tr>
        <!-- 其他行 -->
    </table>
</body>

</html>