JavaScript 页面操作 1

嗯！有5天没更了。双十一，不饶人啊！

1.怎么样用JavaScript实现页面刷新？

---

*其实这个是很简单的，css和html我就不写了*

js代码如下：

function refresh(){
window.location.reload();
}
setTimeout(‘refresh()’,5000);

其实还有一种方式，不调用window对象 ，而是调用document对象，如下：

function refresh(){
document.location.reload();
}
setTimeout(‘refresh()’,5000);

其实window.location===document.location

---

2.实现页面的前进与后退
这个利用的也是BOM对象，window对象的history属性。history的length属性能够表示游览器的游览历史，back和forward方法能实现前进与后退。

---

html代码：



页面的前进和后退

back
forward

js代码：
function fn1(){
window.history.back();//后退
}

function fn2(){
window.history.forward();//前进
}
var btn=document.getElementsByTagName(‘button’);

btn[0].onclick=function(){
console.log(“back”);
fn1();
};
btn[1].onclick=function(){
console.log(“forward”);
fn2();
}

---

3.动态关闭页面
利用BOM提供的对象和属性。

---

html代码：



动态关闭页面



关闭窗口

js代码：
var btn = document.getElementsByTagName(‘button’);
/*function fn(){
window.close(); //测试close方法
}*/
/*btn[0].onclick=function(){
console.log(“success”);
fn();
}*/
var url = “http://news.baidu.com/“;
var features = “height=100,width=100,top=100,left=100,toolbar=no,menubar=no,scrollbar=no,resizable=no,location=no,status=no”;
document.write(‘切换到百度首页‘);
var me =window.open(url,”newW”,features);
/*setTimeout(function(){
me.close();
},3000);*/
btn[0].onclick=function(){
me.close();
}

---

4.点击关闭窗口
html代码：

……

关闭窗口

js代码：
window.opener=null;
window.open(”,’_self’);
var btn=document.getElementsByTagName(‘button’);
btn[0].onclick=function(){
window.close();
}

---