JavaScript读取本地json文件

今天调试了一上午,通过jQuery读取本地json文件总是失败,始终找不出原因,各种方法都试了

开始总以为是不是json格式的问题。高了半天不行

后来读了一个blog发现用的,json.txt文件,试想,是不是改改后缀名也行。于是将后缀名改为.txt,发现ok了

什么原因?tnnd,老子也不知道

json文件,复制粘贴过去到文件就可以了。如果要标准点的就下载个json文件编辑器。format一下,再粘贴过去。

 [
{
"name":"张国立",
"sex":"男",
"email":"zhangguoli@123.com"
},
{
"name":"张铁林",
"sex":"男",
"email":"zhangtieli@123.com"
},
{
"name":"邓婕",
"sex":"女",
"email":"zhenjie@123.com"
}
]

读取文件的代码,当然,你要下载一个jQuery.js文件到你的页面目录下

 <!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8" />
<title>MODEL PAGE</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
var Ajax = function ()
{
$.getJSON ("js/userinfo.txt", function (data)
{
$.each (data, function (i, item)
{
$ ("#disp").append ("<h3>" + item.name + "</h3>");
$ ("#disp").append ("<p>" + item.sex + "</p>");
$ ("#disp").append ("<p>" + item.email + "</p>");
});
});
}
</script>
</head>
<body>
<input type="button" value="Ajax提交" onclick="Ajax();" />
<div id="disp"></div>
</body>
</html>

JavaScript读取本地json文件的更多相关文章

  1. 读取本地json文件,并转换为dictionary

    // 读取本地JSON文件 - (NSDictionary *)readLocalFileWithName:(NSString *)name { // 获取文件路径 NSString *path = ...

  2. jQuery ajax读取本地json文件

    jQuery ajax读取本地json文件 json文件 { "first":[ {"name":"张三","sex": ...

  3. 读取本地json文件,转出为指定格式json 使用Base64进行string的加密和解密

    读取本地json文件,转出为指定格式json   引用添加Json.Net 引用命名空间 using Newtonsoft.Json //读取自定目录下的json文件StreamReader sr = ...

  4. android 读取本地json文件 解决显示乱码显示

    1.读取本地JSON ,但是显示汉字乱码 public static String readLocalJson(Context context,  String fileName){         ...

  5. 读取本地Json文件

    //读取Json文件  地区 //将文件拖到本地  获取json数据 //获取json文件路径 NSString *pathArea=[[NSBundle mainBundle] pathForRes ...

  6. Java读取本地json文件

    背景 之前一直在弄一个Java爬虫,将爬取的信息保存到了数据库中.但这毕竟是一个课程设计,在设计前端GUI,展示数据的时候最开始是直接通过select语句从数据库中查找的,但我担心交给老师后,老师还要 ...

  7. js读取本地json/txt/xml存在跨越问题,可以用jsonp 读取本地json文件

    想自己用 js写一个原生的ajax请求,访问本地文件,json/txt.但是demo,写了一个后,发现 原来是跨域了. js 写的原生ajax 请求代码如下 html代码 <div id=&qu ...

  8. 读取本地json文件,转出为指定格式json

    引用添加Json.Net 引用命名空间 using Newtonsoft.Json //读取自定目录下的json文件 StreamReader sr = new StreamReader(@" ...

  9. vue使用axios读取本地json文件来显示echarts折线图

    编辑器:HBuilderx axios文档:http://www.axios-js.com/zh-cn/docs/ echarts实例:https://echarts.apache.org/examp ...

随机推荐

  1. js获取span标签的值

    <!DOCTYPE html> <html lang="en"><head> <meta charset="UTF-8" ...

  2. winform多线程调用控件

    对多线程操作控件的理解: 控件不能被非创造他的线程修改.需调用控件.beginvoke,注入UI线程.控件.beginvoke会把操作加入UI线程,阻塞画面响应.不要把耗时的计算放在控件.beginv ...

  3. 关于css伪类,伪元素详解总结

    伪类 伪类就是一种虚构的状态或者说是一个具有特殊属性的元素可以使用CSS进行样式修饰.常见的几种伪类是: :link , :visited , :hover , :active , :first-ch ...

  4. python caser运行编码

    #!/usr/bin/env python# -*- coding:utf-8 -*-import os def encryption(): str_raw = raw_input("请输入 ...

  5. 关于display:inline-block布局导致错位问题分析

    移动端设计稿需求是这样的,如下图: 未知的几个头像从左至右并行居中排列. 一般可能直接使用float,但是设计图要求头像排列始终是居中的,于是想到要让它们成为行内元素,然后可使用的方法有flex bo ...

  6. HTTP状态码302、303、307区别

    HTTP状态码3XX表示重定向,表明浏览器需要执行某些特殊的处理以正确处理请求. 301 Moved Permanently 永久性定向.该状态码表示请求的资源已被分配了新的URI,以后应使用资源现在 ...

  7. 【Jmeter】参数Parameters和Body Data

    在做接口并发测试的时候,才发现Jmeter中的Parameters和Body Data两种参数格式并不是简单的一个是xx=xx,另外一个是json格式的参数 先看一个接口 [post] /api/xx ...

  8. Scrum团队开发

    Scrum学习心得 什么是scrum Scrum是迭代式增量软件开发过程,通常用于敏捷软件开发.Scrum包括了一系列实践和预定义角色的过程骨架.Scrum中的主要角色包括同项目经理类似的Scrum主 ...

  9. restful知识点之二restframework视图

    restful协议理解:面向资源开发 restful协议 ---- 一切皆是资源,操作只是请求方式 ----book表增删改查 /books/ books /books/add/ addbook /b ...

  10. Oracle基础之count(1)和count(*)的区别

    在数据库中Count(*)或者Count(1)或者Count([列])或许是最常用的聚合函数.很多人其实对这三者之间是区分不清的.本文会阐述这三者的作用,关系以及背后的原理. 我在网上看到一些所谓的优 ...