如何将特定数据从JSON文件解析到html下拉菜单

时间:2018-11-02 23:59:40

标签: java html css json

JSON FILE

您好,在上面显示的json文件中,比赛日超过30天,我想知道如何将JSON文件中的数据解析为html文件,并在下拉菜单中提供选项以实现按比赛日进行过滤或按团队进行过滤,是否有可能做到这一点,或者我是否过分考虑,我有一个文件来解析数据并将json文件的所有结果显示到一个表中,如下所示 html file showing all matchdays

我想知道是否有办法按特定球队或比赛日筛选这些结果?任何帮助表示感谢

html file taking in the json data

1 个答案:

答案 0 :(得分:0)

下面的代码段将帮助您完成工作。

var json = '{"name":"EnglishPremierLeague2015","rounds":[{"name":"Matchday1:","matches":[{"date":"2015-08-08","team1":{"key":"manutd","name":"ManchesterUnite","code":"MUN"},"team2":{"key":"tottenham","name":"TottenhamHotspu","code":"TOT"},"scorer":1,"score2":0}]},{"name":"Matchday2:","matches":[{"date":"2015-08-09","team1":{"key":"India","name":"IndianCricketTeam","code":"IND"},"team2":{"key":"England","name":"EnglandCricketTeam","code":"ENG"},"scorer":1,"score2":0}]}]}';

var data = JSON.parse(json);

// Filter by Match Day
var filter = $(data.rounds).filter(function () { 
    return this.name == "Matchday1:";
})

// Test Case :)
if (filter.length == 1) {
    console.log("Filter working")
}

var filterbyTeam = $(data.rounds).filter(function () {
    return this.matches.filter(function (e) {
        return e.team1.key == "India" || e.team2.key == "India";
    }).length >= 1;
})

// Test Case :)
if (filterbyTeam.length == 1) {
    console.log("Filter working")
}

此代码将获得带有过滤器的JSON数组,您可以将其进一步用于显示HTML。

注意:您需要根据需要传递过滤器文本。您也可以更改属性以过滤特定数据。

希望这会有所帮助:)