17、location对象
1. 什么是 location 对象
2.URL
<body>
<form action="index.html">
用户名: <input type="text" name="uname">
<input type="submit" value="登录">
</form>
<script>
console.log(location.search);
var params = location.search.substr(1);
console.log(params);
var arr = params.split('=');
console.log(arr);
var div = document.querySelector('div');
div.innerHTML = arr[1] + '欢迎您';
</script>
</body>
3. location 对象的属性
4. 案例:5分钟自动跳转页面
<button>点击</button>
<div></div>
<script>
var btn = document.querySelector('button');
var div = document.querySelector('div');
btn.addEventListener('click', function() {
location.href = 'http://www.itcast.cn';
})
var timer = 5;
setInterval(function() {
if (timer == 0) {
location.href = 'http://www.itcast.cn';
} else {
div.innerHTML = '您将在' + timer + '秒钟之后跳转到首页';
timer--;
}
}, 1000);
</script>
5. 案例:获取URL参数
<div></div>
<script>
console.log(location.search);
var params = location.search.substr(1);
console.log(params);
var arr = params.split('=');
console.log(arr);
var div = document.querySelector('div');
div.innerHTML = arr[1] + '欢迎您';
</script>
6. location对象的常见方法
<button>点击</button>
<script>
var btn = document.querySelector('button');
btn.addEventListener('click', function() {
location.reload(true);
})
</script>