1.BOM介绍
BOM:浏览器对象模型
window最大,包括了document
naviagter:浏览器对象
location:地址栏对象
history:历史记录对象
screen:屏幕对象
2.定时器-延时函数
一次性函数
开启定时器:setTimeout(函数,时间);
关闭定时器:把它赋值给一个变量,然后clearTimeout(变量)
3.递归函数
在自己函数内部调用自己的函数叫递归函数
例如:function fn () {
fn();
}
fn();
function fn (n) { //打印出来的是3
if (n === 0) {
return;
}
fn(n-1);
console.log(n);
}
fn(3);
4.JS执行机制
同步:等这个执行完才执行下一个,依次执行下一个
异步:同时执行
区别:各个流程的执行顺序不同
执行机制:先执行执行栈里的,在执行执行队列里的异步任务
5.location地址栏对象
location.href='地址';href属性用于获取完整的URL地址,对他赋值用于地址的跳转
search属性获取地址中携带的参数,就是?后边部分
hash属性获取地址的哈希值,#后边的部分
reload属性用来刷新页面,参数为true时强制刷新
加载指定的URL:location.assign('htttp:www.jd.com')
替换指定的URL:location.replace('http:www.jd.com')
区别:assign跳转之后可以返回,replace不会返回到原页面 assign可以产生历史记录,replace不会
6.navigator浏览器对象
记录了浏览器自身的相关信息
通过userAgent检测浏览器的版本及平台
7.history历史记录对象
history.length:统计浏览的个数
history.back();可以后退到浏览的下一个页面
history.forward();可以前进一个浏览器的页面
history.go(参数);可以是正数(前进),可以是负数(后退)
8.swiper插件
轮播图的插件
步骤:(1)下载swiper
(2)在package里面找到min.css和min.js引入到html中
(3)可以修改轮播图改成自己想用的样式
注意:多个类名同时使用的时候想要不同的效果要加类名
9.本地存储
声明周期永久有效,关闭浏览器也有效,除非手动删除
存数据:localStorage.setItem('键','值');
取数据:localStorage.getItem('键');
删数据:localStorage.removeItem('键');
本地存储只能存储字符串,无法存储复杂数据类型(对象/数组),要转换为本地字符串,存储到本地
把对象转换为字符串:localStorage.setItem('键',JSON.stringify(obj));
把字符串转化为对象:JSON.parse(JSON字符串)
存储数据如果有多个同属性的,下面的会覆盖上面的
获取不到数据,就会显示null
10.自定义属性
自己定义的属性,可以随意定义,最好用data-xxx
(一)获取属性值:getAttribute('属性名')
设置属性值:getAttribute('属性名','值')
删除属性:removeAttribute('属性名')
(二)如果属性名是data-xxx,以data-开头的
获取属性值:DOM对象.dataset.xxx
设置属性值:DOM对象.dataset.xxx = '值'