AJAX jSON资源 ,jsonplaceholder.typicode
Posted xinfang
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了AJAX jSON资源 ,jsonplaceholder.typicode相关的知识，希望对你有一定的参考价值。
http://jsonplaceholder.typicode.com/ 是一个可以做AJAX练习的网站。
JQuery 和ES6 ：
<!DOCTYPE html> <html lang="zh-cmn-Hans" class="ua-windows ua-webkit"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="renderer" content="webkit"> <meta name="referrer" content="always"> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> <title>json</title> <style></style> </head> <body> <div class="people"> </div> <button id="clash">Clash!</button> <script> window.onload= function(){ const clash = document.querySelector(‘#clash‘); clash.onclick = getData; function getData(){ $.get(‘http://jsonplaceholder.typicode.com/posts‘,setDom) let people = document.querySelector(‘.people‘); let hasName = people.className.includes(‘got‘)?true:false; console.log(hasName); function setDom(data){ if(!hasName){ for(let i=0;i<data.length;i++){ people.innerHTML +=`${data[i].id} ${data[i].title} `; } people.className +=‘ got‘; }else{ people.className = ‘people‘; people.innerHTML =‘‘; } } } } </script> </body> </html>
以上是关于AJAX jSON资源 ,jsonplaceholder.typicode的主要内容，如果未能解决你的问题，请参考以下文章
访问资源时 jQuery Ajax 失败 (Django Tastypie)