无刷新加载页面

无刷新加载页面，提高加载速度，提升用户体验，可实现加载完毕页面入场动画。不用说，要实现无刷新加载肯定是要用到Ajax。原理是只加载一次index（主页），这个主页我们可以理解成一个容器，需要加载新页面时，不必跳转，而是把新页面代码全部读取出来，然后把主页的旧代码清空，最后写入最新的代码即可。

我们把加载页面的函数写在主页里，就算主页的代码被清空了，也不会丢失这个函数，因为已经被浏览器加载到内存中了，所以函数是不会轻易丢失的。

//加载页面
function loadPage(page, self) {
	createMask();
	window.func = null;
	$.ajax({
		type: 'get',
		url: page,
		success: function(data) {
			if (self) {
				window.prevPages.push(self); //入栈
			}
			document.open();
			document.write(data);
			document.close();
			isFinished = true;
			animation();
			if (window.func == "undefined") {
				alert("死了");
			} else {
				window.func();
			}
		},
		error: function() {
			alert("目测是加载失败了~");
		}
	});
}

page是需要加载页面的URI，self则是当前网页本身的文件，因为我要实现返回，所以需要把这个名字压入栈中，当点击返回链接时就是一个出栈的过程，而加载则是入栈的过程，先进后出，正好是我们的需求。

//返回
function retreat() {
	createMask();
	window.func = null;
	var url = window.prevPages.pop(); //出栈
	$.ajax({
		type: 'get',
		url: url,
		success: function(data) {
			document.open();
			document.write(data);
			document.close();
			isFinished = true;
			animation();
			window.func();
		},
		error: function() {
			alert("目测是加载失败了~");
		}
	});
}