Bootstrap可以很方便地操作json數據。它提供了一些非常強大的工具,使我們可以快速、簡單地將json數據添加到網站中。
var data = [ { "name": "John", "age": 30, "city": "New York" }, { "name": "Jane", "age": 25, "city": "Chicago" }, { "name": "Bob", "age": 35, "city": "San Francisco" } ]; $.each(data, function(index, item) { var row = $(""); $("#tableBody").append(row); }); " + item.name + " " + item.age + " " + item.city + "
上面的代碼演示了如何將json數據添加到表格中。使用jQuery的each()函數,循環遍歷json數據,將每個項目都添加到表格的每一行中。
$.ajax({ url: "data.json", dataType: "json", success: function(data) { $.each(data, function(index, item) { var row = $(""); $("#tableBody").append(row); }); } }); " + item.name + " " + item.age + " " + item.city + "
這段代碼使用jQuery的AJAX函數獲取json數據并將其添加到表格中。通過指定dataType為"json",jQuery會自動將返回的數據轉換成json對象,然后我們可以再次使用each()函數將項目添加到表格中。
總之,使用Bootstrap和jQuery,操作json數據非常簡單。您只需一些基本的代碼,即可將數據添加到您的網站中。
上一篇css3寫月食效果