在jQuery開發(fā)中，我們可以通過不同的方法實(shí)現(xiàn)數(shù)據(jù)的傳輸，本文是錯(cuò)新技術(shù)頻道小編為大家?guī)淼膉Query實(shí)現(xiàn)異步獲取json數(shù)據(jù)的2種方式，感興趣的朋友一起來了解一下吧！
通常來說，jQuery異步獲取json數(shù)據(jù)有2種方式，一個(gè)是$.getJSON方法，一個(gè)是$.ajax方法。本文就來實(shí)現(xiàn)使用這2種方式異步獲取json數(shù)據(jù)，然后追加到頁面。
在根目錄下創(chuàng)建data.json文件：
{ "one" : "Hello", "two" : "World"}一、通過$.getJSON方法獲取json數(shù)據(jù)
<script src="Scripts/jquery.html" target="_blank">jquery-2.1.1.min.js"></script> <script type="text/javascript"> $(function() { $.getJSON('data.json', function(data) { var items = []; $.each(data, function(key, val) { items.push('<li id="' + key + '">' + val + '</li>'); }); $('<ul/>', { 'class': 'list', html: items.join('') }).appendTo('body'); }); }); </script>
?
二、通過$.ajax方法獲取json數(shù)據(jù)
<script src="Scripts/jquery-2.1.1.min.js"></script> <script type="text/javascript"> $(function() { $.ajax({ url: 'data.json', dataType: 'json', success: function(data) { var items = []; $.each(data, function(key, val) { items.push('<li id="' + key + '">' + val + '</li>'); }); $('<ul/>', { 'class': 'list', html: items.join('') }).appendTo('body'); }, statusCode: { 404: function() { alert("沒有找到相關(guān)文件~~"); } } }); }); </script>總結(jié)：使用$.getJSON方法和$.ajax方法都能達(dá)到相同的效果，但是，如果想對異步獲取的過程有更細(xì)節(jié)的控制，推薦使用$.ajax方法。
以上就是jQuery實(shí)現(xiàn)異步獲取json數(shù)據(jù)的2種方式，如果你是一名程序員，相信這些內(nèi)容一定對你是很有用的，推薦js.VeVb.com可以學(xué)習(xí)到更多的專業(yè)知識。
新聞熱點(diǎn)
疑難解答
圖片精選
