在客户端读取后台的json文件,使用jquery的$.getJSON,读取后台文件内容。

jQuery中的$.getJSON( )方法函数主要用来从服务器加载json编码的数据,它使用的是GET HTTP请求。使用方法如下:

$.getJSON( url [, data ] [, success(data, textStatus, jqXHR) ] )

url是必选参数,表示json数据的地址;
data是可选参数,用于请求数据时发送数据参数;
success是可参数,这是一个回调函数,用于处理请求到的数据。

$(function(){
$("#btn").click(function(){
$.getJSON("userinfo.json",function(data){
var $jsontip = $("#jsonTip");
var strHtml = "123";//存储数据的变量
$jsontip.empty();//清空内容
$.each(data,function(infoIndex,info){ //$.each()遍历,infoIndex,info index - 选择器的 index 位置  element - 当前的元素(也可使用 "this" 选择器)

})
$jsontip.html(strHtml);//显示处理后的数据
})
})
})
</script>

但是在本地运行时出现错误啦

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

这个错误是浏览器不允许js打开本地文件,这很容易理解嘛,处于安全考虑啦。因为没开服务器,只是简单的打开网页,因此会出错。

json文件的读取的更多相关文章

  1. Python中yaml和json文件的读取和应用

    Python对yaml和json文件的读取: yaml文件读取: 首先创建一个yaml文件test.yaml import yaml   #引入包 f=open(path)  #建立Python的文件 ...

  2. json 文件打读取

    1.获取文件路径 /* * BookController.class.getClassLoader().getResource("static/json/book_nav.json" ...

  3. jquery无法读取json文件问题

    jquery无法读取json文件,如:user.json文件无法读取.把user.json文件的后缀名修改为aspx,文件内容不变,则可以读取~ 原理不懂!~~

  4. 曹工说Spring Boot源码(4)-- 我是怎么自定义ApplicationContext,从json文件读取bean definition的?

    写在前面的话 相关背景及资源: 曹工说Spring Boot源码系列开讲了(1)-- Bean Definition到底是什么,附spring思维导图分享 工程代码地址 思维导图地址 工程结构图: 大 ...

  5. Java读取本地json文件

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

  6. 一些常用的文本文件格式(TXT,JSON,CSV)以及如何从这些文件中读取和写入数据

    TXT文件: txt是微软在操作系统上附带的一种文本格式,文件以.txt为后缀. 从txt文件中读取数据: with open ('xxx.txt') as file: data=file.readl ...

  7. [转]nodejs中package.json和package-lock.json文件的功能分析

    本文转自:https://blog.csdn.net/u013992330/article/details/81110018 最新版nodejs中,多了一个package-lock.json文件,刚开 ...

  8. json文件解析

    场景 读取json文件,读取子域名扫描结果 实现 >>> import json >>> with open("C:\\Users\\Windows32\ ...

  9. 【c++基础】从json文件提取数据

    前言 标注数据导出文件是json格式的,也就是python的dict格式,需要读取标注结果,可以使用c++或者python,本文使用c++实现的. JsonCpp简介 JsonCpp是一种轻量级的数据 ...

随机推荐

  1. 讲完.class,Class之后,继续。

    讲完.class,Class之后,继续. 1)泛化的Class引用 Class也可以加入泛型,加入之后会进行类型检查. 贴一下书上原话,Class<?>优于Class,虽然他们是等价的,C ...

  2. Git练习3 远程库分支 idea中状态条显示当前分支

  3. array类型的方法

    var arr1 = [12,454,'dafda','feagfag',23]; var arr2 = [46468,'ffwfe','dafs','dfsfs']; arr1.indexOf('d ...

  4. Appium + Python自动化3 - 输入中文

    在做app自动化过程中会踩很多坑,咱们都是用中文的app,所以首先要解决中文输入的问题!本篇通过屏蔽软键盘,绕过手机的软键盘方法,解决中文输入问题. 一.定位搜索 1.打开淘宝点击搜索按钮,进入搜索页 ...

  5. windows下apache服务器的下载,安装,配置

    1.进行apache官网->Download->Files for Microsoft Windows->ApacheHaus,然后选择合适的版本下载 2.将下载下来的压缩包解压到合 ...

  6. C++之Vect

    在C++中数组和向量都是多同类元素的集合,他们也有很明显的区别 1 数组属于静态分配,编译之前必须知道数组的大小,一旦确定就不能更改:2个数组之间不能直接赋值实现拷贝,而必须显式用for或者拷贝函数拷 ...

  7. UnityError 打包到Android错误解决

  8. Murano Weekly Meeting 2015.07.14

    会议时间: 2015.07.14 主持人: Kirill Zaitsev, core from Mirantis 会议摘要:  1.periodic nightly builds,然后通过mailin ...

  9. 二,JVM 自带命令行工具之JStat

    jstat:虚拟机统计信息见识工具 jstat是用于见识虚拟机各种运行状态信息的命令行工具.他可以显示本地或远程虚拟机进程中的类装载.内存.垃圾收集.JIT编译等运行数据. jstat option ...

  10. 性能测试学习第二天_性能测试工具概述Loadrunner介绍

    性能测试工具概述Loadrunner介绍 http://www.51testing.com/html/42/n-6542.html 其中,T直接影响用户体验时间 性能测试的原理: 记录一个访问过程的通 ...