一、BOM中的一些对象:
- location:
1.location.href实现页面的跳转;
2.location.reload()页面刷新;
3.location.search;
4.location.hash:锚点;
- history对象:
1.页面前进后退;
2.history.go(num):
- history.go(1):前进一页
- history.go(-1):后退一页
3.history.forward();
4history.back();
- navigator:
1userAgent:查看浏览器版本;
二、案例
1、短信验证注册
<body>
<input type="button" value="点击发送短信">
<script>
//1. 给按钮注册点击事件
//2. 禁用按钮
//3. 开始定时器,一秒钟修改一次按钮的内容
//4. 当时间变成0了,清除定时器, 启用按钮, 恢复按钮的内容
var btn = document.querySelector("input");
btn.onclick = function () {
var count = 60;
//禁用按钮
btn.disabled = true;
//开启定时器
var timeId = setInterval(function () {
//修改按钮的内容 5秒后在次发送
count--;
btn.value = count+"秒后在次发送";
//判断count是否是0
if(count == 0) {
//清除定时器
clearInterval(timeId);
//恢复按钮
btn.disabled = false;
btn.value = "点击发送短信";
}
}, 1000);
};
</script>
</body>
2、自动跳转
<body>
<a href="http://www.baidu.com">注册成功,3秒自动跳转到登录页</a>
<script>
var link = document.querySelector('a');
var time = 3;
setInterval(function() {
time--;
link.innerText = '注册成功,' + time + '秒自动跳转到登录页';
if (time === 0) {
location.href = link.href;
}
}, 1000);
</script>
</body>