后退的页面加载机制与动态html的影响
测试代码:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
window.onload = function () {
alert(document.body.innerHTML)
var div = document.createElement('div');
div.innerHTML = "div";
div.onclick = a;
document.body.appendChild(div);
}
function appendH1() {
var conel=document.getElementById('con');
conel.innerHTML = conel.innerHTML + "<h1>h1</h1>";
}
</script>
</head>
<body>
<p><a href="http://www.sina.com.cn/">sina</a><button onclick="appendH1()">append h1</button></p>
<div id="con"></div>
</body>
</html>
测试方法:
1.点击appendh12.点击sina
3.在sina页面加载完毕的时候点击后退,或正在加载的时候点击后退
(选择sina的原因是,它不可能瞬间打开,能区分加载完毕的后退和正在加载的后退。)
测试浏览器:
firefox3.6.3
IE8 & 360安全浏览器
chrome 5.0
测试结论:
下面3种浏览器,在后退时,会加载html,然后触发onload事件。这时,页面中append的h1标签不会保留。
IE8 & 360安全浏览器
chrome 5.0
下面1种浏览器,会保留跳转离开前的dom状态,包括用户操作造成的dom结构的变化。
firefox3.6.3
Javascript在页面后退时,在以上各种测试浏览器中都是重新加载javascript脚本并执行。