JavaScript数据对象和渲染

这是我的密码

  var readAll = function () {
    $.ajax(
            {
                url: _spPageContextInfo.webServerRelativeUrl +
                    "/_api/web/lists/getByTitle('PhoneBook')/items/" +
                    "?$select=Id, Title, pb_FirstName, pb_PhoneNumber" +
                    "&$orderby=Title,pb_FirstName, pb_PhoneNumber",
                type: "GET",
                headers: {
                    "accept": "application/json;odata=verbose",
                },
                success: function (data) {
                    console.log(data);
                },
                error: function (err) {
                    alert(JSON.stringify(err));
                }
            }
        );
};


$(document).ready(function () {
    readAll();
});

data = {
    "d": {
        "results": [{
            "__metadata": {
                "id": "b4d773a6-f31e-442d-8974-38c535d491d6",
                "uri": "mysite:6555",
                "etag": "\"1\"",
                "type": "SP.Data.LST_x005f_PhoneBookListItem"
            },
            "Id": 1,
            "Title": "name11",
            "pb_FirstName": "name",
            "pb_PhoneNumber": "1234",
            "ID": 1
        }]
    }
}

function readList(data) {

    var html = [];
    html.push("<table><thead><tr><th>ID</th><th>First Name</th>" +
              "<th>Last Name</th><th>Phone</th></tr></table></thead>");

    data = data.d.results;
    for (var i = 0; i < results.length; i++) {
        html.push("<tr><td>");
        html.push(results[i].ID);
        html.push("</td><td>");
        html.push(results[i].Title);
        html.push("</td><td>");
        html.push(results[i].pb_FirstName);
        html.push("</td><td>");
        html.push(results[i].pb_PhoneNumber);
        html.push("</td><tr>");
    }

    html.push("</table>"`enter code here`);
    $('.table').html(html.join(''));
}

var readAll=函数（）{
$.ajax(
{
url:_spPageContextInfo.webServerRelativeUrl+
“/_api/web/list/getByTitle（'PhoneBook'）/items/”+
“？$select=Id、标题、pb\U名字、pb\U电话号码”+
“&$orderby=Title，pb_FirstName，pb_PhoneNumber”，
键入：“获取”，
标题：{
“接受”：“application/json；odata=verbose”，
},
成功：功能（数据）{
控制台日志（数据）；
},
错误：函数（err）{
警报（JSON.stringify（err））；
}
}
);
};
$（文档）.ready（函数（）{
readAll（）；
});
数据={
“d”：{
“结果”：[{
“_元数据”：{
“id”：“b4d773a6-f31e-442d-8974-38c535d491d6”，
“uri”：“mysite:6555”，
“etag”：“1”，
“类型”：“SP.Data.LST_x005f_PhoneBookListItem”
},
“Id”：1，
“标题”：“名称11”，
“pb_FirstName”：“name”，
“pb_电话号码”：“1234”，
“ID”：1
}]
}
}
函数读取列表（数据）{
var html=[]；
html.push（“IDFirst Name”+
“姓氏电话”）；
数据=数据d.结果；
对于（var i=0；i

因此，我在控制台中得到一个包含数据的json数组。我正在尝试将数据放入我的html表中。但是我不知道怎么做。所以我需要带上我的数据对象，并以正确的html格式呈现它 希望你能帮我更换

console.log(data);

有一个奇怪的名字

readList(data);

---

您应该使用$.get来获取数据，使用handlebar来呈现带有数据的html，这很简单。

var模板=”\
\
\
身份证\
头衔\
名字\
电话\
\
\
\
{{{#对象}}\
\
{{Id}\
{{Title}}\
{{pb_FirstName}}\
{{pb_PhoneNumber}}\
\
{{/objects}}\
\
";
$.get（'someurl'）
.成功（功能（响应）{
//这里将数据呈现为html
//我们可以使用车把，是一个模板引擎。
$（“#box”）.html（handlebar.compile（模板）（{'objects'：response['d']['results']}））；
})
.error（函数（err）{
警报（JSON.stringify（err））；
});

请不要做类似于

html.push（结果[i].Title）的事情不首先确保您不易受到攻击。如果没有，请记录为什么没有。我应该如何将数据呈现为html？你能举个例子吗？
var template = "<table>\
    <thead>\
        <tr>\
            <th>ID</th>\
            <th>Title</th>\
            <th>First Name</th>\
            <th>Phone</th>\
        </tr>\
    </thead>\
    <tbody>\
    {{#objects}}\
    <tr>\
        <td>{{ Id }}</td>\
        <td>{{ Title }}</td>\
        <td>{{ pb_FirstName }}</td>\
        <td>{{ pb_PhoneNumber }}</td>\
    </tr>\
    {{/objects}}\
    </tbody>\
</table>";

$.get('someurl')
.success(function(response){
    //here render data to html
    // We can use Handlebars, is a engine of templates.
    $("#box").html(Handlebars.compile(template)({'objects' : response['d']['results']}));
})
.error(function(err){
    alert(JSON.stringify(err));
});