jquery03.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. </head>
  7. <body>
  8. <button id="loadBtn">加载</button>
  9. <script src="js/jquery.min.js"></script>
  10. <script>
  11. $(function() {
  12. $('#loadBtn').on('click', function() {
  13. $.ajax({
  14. type: 'get',
  15. url: 'http://api.tianapi.com/meinv/',
  16. data: {
  17. key: '772a81a51ae5c780251b1f98ea431b84',
  18. num: 10
  19. },
  20. dataType: 'json',
  21. success: function(json) {
  22. for (var i = 0; i < json.newslist.length; i += 1) {
  23. var mm = json.newslist[i];
  24. // $('<img>').attr('src', mm.picUrl).attr('width', 300)
  25. // .insertBefore($('#loadBtn'));
  26. $('<p>').append($('<a>')
  27. .attr('href', mm.picUrl)
  28. .attr('target', '_blank')
  29. .text(mm.title)
  30. ).insertBefore($('#loadBtn'));
  31. }
  32. },
  33. error: function() {}
  34. });
  35. // $.getJSON(url, function(json) {
  36. // for (var i = 0; i < json.newslist.length; i += 1) {
  37. // var mm = json.newslist[i];
  38. // $('<img>').attr('src', mm.picUrl).attr('width', 300)
  39. // .insertBefore($('#loadBtn'));
  40. // }
  41. // });
  42. });
  43. });
  44. </script>
  45. </body>
  46. </html>