浏览器的方法
- 1浏览器的地址信息 window有一个 location 内部记录了浏览器的地址信息 window.location loctiono 内部有一个 href 的属性
// 1 :window.location.href
setTimeout(function(){
window.location.href = 'https://www.baidu.con/'
},3000)
//设置了一个倒计时器 打开页面3秒后跳转到 https://www.baidu.con/
- 2 浏览器的刷新功能 window有一个 location 有一个 reload 方法 这个方法是刷新
// 2:window.location.reload
var count = 0
setInterval(function(){
count++
console.log( count)
if( count == 5){
window.location.reload
}
} , 3000)
//设置一个定时器每3秒count执行一次++操作 当count==5时页面刷新
-
3浏览器的历史纪录(模拟左上角的 回退 和前进功能) window有一个 history方法里 有一个 back() 的函数
window.history.back() 回退 window.history.forward()前进 window.history.go(1)前进 window.history.go(-1)回退 在控制台里输入 但要先打开新的页面
本地存储(面试必问)
-
1.localStorage 浏览器的本地存储(永久存储), 打开浏览器存储上之后 关闭浏览器 信息还在 1.1: localStorage 的设置语法: window.localStroage.setItem(key, value) key:要求见名知意 value: 必须时字符 1.2: localStorage 的获取语法: window.localStroage.getItem(key)
1.3: localStorage 的删除语法: window.localStroage.removeItem() 1.4: localStorage 的清除语法: window.localStroage.clear()
// 1.localStorage 设置语法
window.localStorage.setItem('qq', '888888')
window.localStorage.setItem('mina', '66666')
window.localStorage.setItem('ceshhi3', '3333333')
window.localStorage.setItem('ceshhi3', '4444444')
// 1.2:localStorage 获取语法
console.log( window.localStorage.getItem('qq'))
// 1.3:localStorage 删除语法
console.log( window.localStorage.removeItem('mina'))
// 1.3:localStorage 清除语法
console.log( window.localStorage.clear()) //使用会清楚所有的数据
- 2.sessionStorage 浏览器的临时存储 特点:页面关闭直接清楚数据 2.1设置语法 : window.sessionStorage.setItem( key, value) //value 的值必须为 字符串 2.2获取语法 : window.sessionStorage.getItem( key, value) //value 的值必须为 字符串 2.3删除语法 : window.sessionStorage.removeItem( key, value) //value 的值必须为 字符串 2.4清除语法 : window.sessionStorage.clear
//2.1sessionStorage 的设置
console.log( window.sessionStorage.setItem('vx', '12345678')) //value 的值必须为 字符串
//2.2sessionStorage 的获取
console.log( window.sessionStorage.getItem('vx', '12345678')) //value 的值必须为 字符串
//2.3sessionStorage 的删除
console.log( window.sessionStorage.removeItem('vx', '12345678')) //value 的值必须为 字符串
//2.4sessionStorage 的清除
console.log( window.sessionStorage.clear()) //value 的值必须为 字符串
浏览器的事件
-
1 浏览器的 onload 事件 onload 事件, 等到页面的所有的资源加载完毕以后再执行 浏览器的图片加载时异步加载 目前还感受不到
-
2浏览器的 onscroll 事件 onscroll 事件, 当浏览器页面滚动的时候就会触发
-
2.1:浏览器的滚动距离 因为时页面在滚动,所以需要使用 doucument 对象去获取滚动的距离 方法: <!-- 1:document.body.scrollTop 在浏览器没有声明
2:document.documentElement.scrollTop: 在览器声明了< !DOCTYPE htmL> 就目前而言 浏览器必定都声明了< !DOCTYPE htmL> ,所以推荐使用 左右 1:document.body.scrollLeft 在浏览器没有声明<!DOCTYPE htmL> 2:document.documentElement.scrollLeft 在览器声明了< !DOCTYPE htmL> -->
// 1:onload
window.onload = function(){
console.log(100)
}
// 2:onscroll
window.onscroll = function(){
console.log('页面滚动我(onscroll)就触发.....')
}
// 2.1:document.documentElement.scrollTop ( Top 改成 Left 就是浏览器宽度)
window.onscroll = function(){
console.log('开始滚懂....')
console.log( 'document.documentElement.scrollTop:',document.documentElement.scrollTop )
console.log( 'document.documentElement.scrollLeft:',document.documentElement.scrollLeft )
}
时间对象
*Date 语法:var timer =new Date( ) 注意大写
时间对像 接受的参数两种方式
- 1.数字传参
01: var timer =new Date(2008, 01, 28, 12, 13, 14)
// 参数1. 代表年份 (years)
// 参数2. 代表月份 ( 注意!!!) 月份从 0 开始 即 0 代表一月 11 代表 十二月
// 参数3. 天数
// 参数4. 小时
// 参数5. 分钟
// 参数6. 秒
console.log( timer)
- 2.字符串传参
02: var timer =new Date(2008-01-20 13:14:15)// '年-月-日 时:分:秒'
// 参数1. 代表年份 (years)
// 参数2. 代表月份 ( 注意!!!) 月份从 0 开始 即 0 代表一月 11 代表 十二月
// 参数3. 天数
// 参数4. 小时
// 参数5. 分钟
// 参数6. 秒
console.log( timer)
var timer = new Date( )//默认获取当前时间
console.log( timer)
timer1 = new Date('2022-11-1 12:12:14')//获取指定时间
console.log( timer1)
timer2 = new Date(2022, 11, 11, 12, 12, 12)//获取指定时间
console.log( timer2)
时间对象的获取
- 语法 时间对象.getXXXX()
var timer = new Date()
console.log(timer)
//获取年分
var year = timer.getFullYear()
console.log(year)
//获取月份
var month = timer.getMonth()
console.log(month)
//获取每周的第几天
var day = timer.getDay()
console.log(day)
//获取每月的第几天
var day1 = timer.getDate()
console.log(day1)
//获取小时
var hours = timer.getHours()
console.log(hours)
//获取分钟
var minutes = timer.getMinutes()
console.log(minutes)
//获取秒钟
var second = timer.getSeconds()
console.log(second)
事件对象的设置
- 语法时间对象.setXXXX()
var timer = new Date()
console.log( timer)
//设置年份
timer.setFullYear(2008)
var year = timer.getFullYear()
console.log(year)
//设置月份
timer.setMonth(9)// 月份 0-11
var month = timer.getMonth()
console.log(month)
//设置天
timer.setDate(28)
var mDay = timer.getDate()
console.log(mDay)
//设置小时
timer.setHours(14)
var hours = timer.getHours()
console.log(hours)
//设置分钟
timer.setMinutes(54)
var minutes = timer.getMinutes()
console.log(minutes)
//设置秒
timer.setSeconds(50)
var seconds = timer.getSeconds()
console.log(seconds)
//设置毫秒
timer.setMilliseconds(999)
var millis = timer.getMilliseconds()
console.log(millis)
//设置距离1970 的总毫秒
// timer.setTime(123456789)
var time = timer.getTime() //注释掉设置 距离1970 的总毫秒 得到当前时间距离1970 的总毫秒
console.log(time)