Question

我目前正在尝试创建类似于this one.

的字符排名系统

使用官方API，我可以通过$.getJSON和URL将所有数据附加到表中。

到目前为止，我正在显示20个字符，并将所有字符数据存储在多个表行中（每个字符一个），但是还没有弄清楚如何将字符对象分成多个<td>，这样我就可以更好地控制通过CSS进行处理。

代码如下：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $.getJSON("http://api.pathofexile.com/ladders/Standard?callback=?", function (result) {

                    $("#tdPlayer").append("<td>" + result["total"] + "</td>" + "<br/>");

                    $("#tdSince").append("<td>" + result["cached_since"] + "</td>" + "<br/>");

                    $.each(result["entries"], function (index, value) {
                        $("#tdRanking").append("<tr>" + "<td>" + JSON.stringify(index, null, '\t') + ": " + JSON.stringify(value, null, '\t') + "</td>" + "</tr>" + "<br/>");

                    });
                });
            });
        });

    </script>
</head>

<body>

    <button>Anzeige der Top 20 Spieler in der Incursion Liga</button>

    <div>
        <table>
            <tr>
                <td id="tdPlayer">Anzahl der Spieler:</td>
                <td id="tdSince">Suchbeginn: </td>
            </tr>
            <tr>
                <td colspan="2" id="tdRanking">Spieler: (max. 20 angezeigt)</td>
            </tr>
        </table>
    </div>

</body>

</html>

我从can be found here附加数据的整个JSON对象。

Answer 1

您可以使用未字符串化的value变量访问$ .each函数中的字符属性。例如，要访问角色名称，请使用value.character.name

$("#tdRanking").append("<tr><td>" + JSON.stringify(index, null, '\t') + '<td>' + value.character.name + "</td></tr>");

我在codepen

上添加了一个示例

请注意，由于您的数据源未通过https：//

提供，因此我没有使用ajax来检索数据

将JSON对象拆分为多个

1 个答案: