访问本地json文件的方法

情景：在一个js文件中访问该工程中的另一个本地json文件

这个问题本身很好解决，这里提供两个方法，先介绍一些可能会让初学者迷惑的知识点：

1.URL编码：利用一个百分号和16进制数字来对字符进行编码，JS提供了encodeURIComponent（）和decodeURIComponent（）方法来进行URL编码和解码

2.浏览器端的JavaScript发送HTTP请求所用的接口叫做XMLHttpRequest，当然这个接口跟XML并没有关系，之所以带XML前缀只是历史原因，实际上，JS中很多名称都因为历史原因而产生歧义。

3.URL分为绝对路径和相对路径，绝对路径顾名思义，没什么可解释，相对路径在书写时，需要注意：如果以斜杠"/"开头，则这个相对路径会替换当前路径中服务器后面的路径，如果不以斜杠开头，浏览器会会将相对路径添加到当前路径后，并在中间用斜杠分隔。

4.发送请求的时候，需要三步：

①创建一个XMLHttpRequest对象：var req = new XMLHttpRequest ();

②利用open方法设置请求头的一些信息，包括三个参数，第一个是请求方式（GET或者POST等），第二个为路径，第三个为true或者false（异步为true，同步为false）

③利用send方法发送请求体，如果是GET方法，则可以为null

5.同步和异步的区别

（1）在这种原生方法里，如果是同步，即open方法的第三个参数为false时，可以立即使用响应的结果，如使用获取的数据，但当网络连接状态不佳时，服务器很慢时，会耗费大量时间，并且这期间无法触发事件处理器，无法实现与用户的交互。为了避免这种情况，需要采用异步的方式

（2）如果是异步，为了检测什么时候请求执行完成，要添加load的监听事件，并判断一些响应状态

最终解决代码：说了这么多，其实也可以直接ajax请求

            function success(string){
			console.log(string)
		}
		
		function readFile(callback){
			var req = new XMLHttpRequest();
			req.open("GET","../test.json",true);
			req.addEventListener("load",function(){
				if( req.status<400 )
					callback("yes");
			})
			req.send(null);
			var js = JSON.parse( req.responseText );
			console.log(js.time);
			$("#div").text(js.time)
		}
		
		readFile(success)
		

		//直接使用ajax访问
		$.ajax({
			type:'get',
			url:'../test.json',
			dataType:'json',
			success:function(data){
				console.log(data.time)
				$("#div").text(data.time)
			}
		})