几个对象
location对象
window对象给我们提供了一个location属性用于获取或设置窗口的URL,并且可以用于解析URL,因为这个属性返回的是一个对象,所以我们称这个属性为location。
URL
统一资源定位符是互联网上标准资源的地址,互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器如何处理
- location.href:获取或设置整个URl;
- location.search:返回参数;
- location.href = ‘’;可以实现跳转页面
实现一个一定时间后跳转页面的动作:
<button>点击</button>
<div></div>
<script>
var btn = document.querySelector('button');
var div = document.querySelector('div');
//1.自动跳转
btn.addEventListener('click',function(){
location.href = 'LBJ.html';
})
//2.定视跳转
var timer = 5;
setInterval (function(){
if(timer == 0){
location.href = 'LBJ.html';
}else{
div.innerHTML = '您将在'+timer+'秒钟之后之后跳转页面';
timer--;
}
},1000);
</script>
获取URl的参数
- ①第一个页面,里面有提交表单,action提交到第二个页面
- ②第二个页面,可以使用第一个页面的参数,这样实现了一个不同页面之间的传递效果
- ③第二个页面利用了UPL里面的location.seach参数
- ④在第二页面中,需要把这个参数提取
- ⑤第一步去掉‘?’利用substr
- ⑥第二步 利用 = 号分割 键 和 值 split(‘=’)
首先我们需要一个登录页面
<form action="index.html">
用户名:<input type="text" name="uname">
<input type="submit" value=“登录”>
接下来弄第二个欢迎页面
<div></div>
<script>
console.log(location.search);//?uname=andy
//1.先去掉? substr('起始的位置',截取几个字符);
var params = location.seearch.substr(1);//uname= andy
console.log(params);
//2.利用=把字符串分割为数组 split('=');
var arr = params.split('=');
console.log(arr);//得到两个数组["uname","andy"]
//3.把数据写入div中
div.innerHTML = arr[1] + '欢迎您';
</script>
location对象的方法
loaction对象方法 | 返回值 |
---|---|
location.assign () | 和href一样,可以跳转页面(也称为重新定向页面)记录我们的浏览历史,是可以返回的 |
location.replace() | 替换当前页面,因为不记录历史,所以不能后退页面 |
location.reload | 重新加载页面,相当于刷新按钮或者f5,如果参数未true强制刷学ctrl+f5 |
navigatior对象
navigatior对象包含有关浏览器的信息它有很多属性,最常用的是userAgent,该属性可以返回客户机发送服务器的user-agent头部的值
if(navigator.userAgent.match(/phone/pad)){
window.location.href = " ";//手机
}else{
window.location.hreff = " ";//电脑
}
history对象
history对象方法 | 作用 |
---|---|
back() | 可以后退功能 |
forward() | 前进功能 |
go(参数) | 前进后退参数 参数如果是1,前进一个页面;如果参数是-1则后退一个页面 |