ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Web APIs 第六天 BOM

2021-09-26 20:59:05  阅读:124  来源: 互联网

标签:Web 执行 浏览器 APIs 对象 BOM history fn 属性


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 = '值'

标签:Web,执行,浏览器,APIs,对象,BOM,history,fn,属性
来源: https://blog.csdn.net/summer_66/article/details/120496910

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有