ajax 读取json数据
博客专区 > heiyexue 的博客 > 博客详情
ajax 读取json数据
heiyexue 发表于4年前
ajax 读取json数据
  • 发表于 4年前
  • 阅读 9
  • 收藏 0
  • 点赞 0
  • 评论 0

标题:腾讯云 新注册用户域名抢购1元起>>>   

  • 首先建立json.txt文件 
  •  
  • "programmers": [ 
  • { "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }, 
  • { "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }, 
  • { "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com"
  • ], 
  • "authors": [ 
  • { "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" }, 
  • { "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }, 
  • { "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction"
  • ], 
  • "musicians": [ 
  • { "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }, 
  • { "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano"
  •  
  • 通过异步调用,来读取json数据 
  •  
  • <html xmlns="http://www.w3.org/1999/xhtml"
  • <head runat="server"
  • <script type="text/javascript"
  • var xmlHttp; 
  • function createXMLHttpRequest() 
  •     if(window.ActiveXObject) 
  •     { 
  •         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
  •     } 
  •     else if(window.XMLHttpRequest) 
  •     { 
  •         xmlHttp = new XMLHttpRequest(); 
  •     } 
  • function startRequest() 
  •     createXMLHttpRequest(); 
  •     try 
  •     { 
  •         xmlHttp.onreadystatechange = handleStateChange; 
  •         xmlHttp.open("GET", "Json.txt", true); 
  •         xmlHttp.send(null); 
  •     } 
  •     catch(exception) 
  •     { 
  •         alert("xmlHttp Fail"); 
  •     } 
  • function handleStateChange() 
  • {    
  •     if(xmlHttp.readyState == 4) 
  •     {        
  •         if (xmlHttp.status == 200 || xmlHttp.status == 0) 
  •         { 
  •             var result = xmlHttp.responseText; 
  •             var json = eval("(" + result + ")"); 
  •             alert(json.programmers[0].firstName);//读取json数据 
  •             //alert(json.sex); 
  •         } 
  •     } 
  • </script> 
  • </head> 
  • <body> 
  •     <div> 
  •         <input type="button" value="AjaxTest" onclick="startRequest();" /> 
  •     </div> 
  • </body> 
  • </html> 
  • 共有 人打赏支持
    粉丝 2
    博文 79
    码字总数 78924
    ×
    heiyexue
    如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
    * 金额(元)
    ¥1 ¥5 ¥10 ¥20 其他金额
    打赏人
    留言
    * 支付类型
    微信扫码支付
    打赏金额:
    已支付成功
    打赏金额: