js进阶解决浏览器缓存不能自动更新的问题(在ajax的url上带上一个参数,可以是日期,或者是随机数)(随机数Math.random)(取得日期的毫秒数:new Date().getTime();)
一、总结
js中的随机数Math.random
js中取得日期的毫秒数:new Date().getTime();
二、js进阶解决浏览器缓存不能自动更新的问题
ajax1.js
function ajax(url,funSucc,fnFaild){ var xhr=new XMLHttpRequest(); url=url+'?'+new Date().getTime(); //1、在url上带上一个参数,可以是日期,或者是随机数 2、在ajax这里带的话,浏览器的地址栏和原来是一样的
xhr.open('GET',url,true); xhr.send(null); xhr.onreadystatechange=function(){ if (xhr.readyState==4) { if (xhr.status==200) { funSucc(xhr.responseText) }else{
if (fnFaild){
fnFaild(xhr.statusText)
} }
}
} }
html测试代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax01</title>
<style type="text/css">
div{
background: green;
width: 300px;
height: 200px;
}
</style>
<script type="text/javascript" src="ajax1.js"></script>
</head>
<body>
<input type="button" id="btn" value="测试按钮">
<div id="div1"></div>
<script>
var btn=document.getElementById('btn');
var div1=document.getElementById('div1');
btn.onclick=function (){
ajax('hero.txt',function(str){
div1.innerHTML=str
},function(s){
alert(s)
})
}
</script>
</body>
</html>