如何将JSON文件数据显示到HTML表中（仅使用JavaScript，不使用jQuery）_Javascript_Html_Css_Json

如何将JSON文件数据显示到HTML表中（仅使用JavaScript，不使用jQuery）

javascript html css json

如何将JSON文件数据显示到HTML表中（仅使用JavaScript，不使用jQuery）,javascript,html,css,json,Javascript,Html,Css,Json,我是新的网络开发，我正在做一个网站。我想使用JavaScript在HTML表中显示JSON数据。据我所知，这个代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">

我是新的网络开发，我正在做一个网站。我想使用JavaScript在HTML表中显示JSON数据。据我所知，这个代码

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>stocksite</title>
   <link rel="stylesheet" href="css/bootstrap.min.css">
   <link rel="stylesheet" href="css/stylesheet.css">
</head>
<body onload="loadData()">
   <table> 
     <tr>
       <td id="dt"></td>      
     </tr>
   </table>

   <script>
    
    var data, i;
    function loadData() {
        var xhttp = new XMLHttpRequest();
        xhttp.open('GET', 'data.json', true);
        
        xhttp.send();
        xhttp.onreadystatechange = function () {
            if (xhttp.readyState == 4 && xhttp.status == 200) {
                data = JSON.parse(xhttp.responseText);
                for(i=0; i<data.stocktrade.length; i++){
                    document.getElementById('dt').innerHTML=data.stocktrade[i].date;
                }
                
            }
            
        }
    }
</script>


牲畜场
var数据，i；
函数loadData（）{
var xhttp=newXMLHttpRequest（）；
open（'GET'，'data.json'，true）；
xhttp.send（）；
xhttp.onreadystatechange=函数（）{
如果（xhttp.readyState==4&&xhttp.status==200）{
data=JSON.parse（xhttp.responseText）；
对于（i=0；i类似的东西

//const data=require（'/data.json'）；这样导入文件即可
//假设你有如下数据
常数数据={
“证券交易”：[{
“用户ID”：1，
“名字”：“克里斯”，
“姓氏”：“李”，
“电话号码”：“123456”，
“电子邮件地址”：“krish。lee@learningcontainer.com"
},
{
“用户ID”：2，
“firstName”：“racks”，
“姓氏”：“杰克森”，
“电话号码”：“123456”，
“电子邮件地址”：“机架”。jacson@learningcontainer.com"
},
{
“用户ID”：3，
“名字”：“拒绝”，
“姓氏”：“烤”，
“电话号码”：“33333333”，
“电子邮件地址”：“拒绝”。roast@learningcontainer.com"
},
{
“用户ID”：4，
“firstName”：“devid”，
“姓氏”：“neo”，
“电话号码”：“2222222”，
“电子邮件地址”：“设备”。neo@learningcontainer.com"
},
{
“用户ID”：5，
“名字”：“jone”，
“lastName”：“mac”，
“电话号码”：“111111111”，
“电子邮件地址”：“jone。mac@learningcontainer.com"
}
]
};
var i；
函数loadData（）{
const dtable=document.getElementById（'dtable'）；
对于（i=0；i


牲畜场
代码乍一看很好，只是您一直在覆盖
的内容。如果要创建表，需要a）创建包含包含文本的单元格的行，b）追加而不是覆盖。（此外，每天都会询问如何在表中显示JSON数据；请先查找现有问题）