一、时间定时器
1、超时调用
setTimeout(fun,time)    【返回一个唯一标识该超时调用的ID数值】
参数:
fun:要执行的函数
time:设置第多少毫秒后执行fun函数

clearTimeout(ID)    取消超时调用定时器【通过定时器返回的唯一标识ID值取消定时器】
eg:

    var id = setTimeout(function(){
console.log('hello');
},10000); //设置第10秒后输出hello
console.log('--------------');
setTimeout(function(){
//5秒后终止setTimeout
console.log('5000毫秒');
//清除超时调用
clearTimeout(id); //第5秒后输出5000毫秒并清除id定时器
},5000);

2、间歇调用
setInterval(fun,time)    【返回一个唯一标识该超时调用的ID数值】
按照指定的时间间隔重复执行fun函数代码,直到间歇调用被取消或页面被卸载
参数:
fun:要执行的函数
time:设置每个多少毫秒时间执行fun函数

clearInterval(ID)   取消间歇调用【通过定时器返回的唯一标识ID值取消定时器】
eg:

    //每隔一秒后输出1
var sid = setInterval(function(){
console.log(1);
},1000);
//在第10秒后清除间歇调用
setTimeout(function(){
clearInterval(sid); //第10秒后取消sid定时器,sid只执行了9次,在第10秒后就被取消了
},10000);

二、系统对话框    【调用对话框显示时会停止执行代码,关闭后在继续执行,如需在弹出框中显示换行,使用转义字符\n】
1、alert(要显示的警告信息)   【警告对话框】
显示包含指定的文本和一个"OK"按钮

2、confirm(要显示的确认信息)   【确认对话框】 【返回布尔类型】
显示包含指定的文本和一个"OK"按钮以及"Cancel"按钮

该方法返回布尔值:
a、单击了OK返回true
b、单击cancel或者关闭按钮返回false

3、prompt(要显示提示信息,[文本输入域显示的默认值])   【提示会话框】【返回输入域的值或null】
显示包含文本,ok按钮,cancel按钮以及一个文本输入域,以供用户在其中输入内容;第二个参数可以不写

该方法返回值:
a、单击OK按钮,该方法返回输入域的值
b、单击了Cancel或者关闭对话框该方法返回null

三、window对象
1、window对象的一些相关属性:
innerWidth  浏览器窗口的内宽度(以像素计)
innerHeight  浏览器窗口的内高度(以像素计)

2、window对象的一些相关方法:
open(url)  打开新窗口【在新选项卡中打开url页面】
close()  关闭当前窗口【大多数浏览器只允许脚本自动关闭由脚本创建的窗口】
moveTo(x,y)  移动当前窗口 【可把窗口的左上角移动到一个指定的坐标】
resizeTo(width,height)  重新调整当前窗口【可把窗口的左上角移动到一个指定的坐标】
stop()  停止页面载入

四、location对象    【既是window对象也是document对象】
提供与当前窗口中加载的文档有关的信息,还提供一些导航功能。
eg:

    console.log(window.location == document.location);  //true

1、location对象的一些相关属性:
host  返回带端口号的服务器名称
hostname  返回不带端口号的服务器名称
href  返回当前加载页面的完整URL
pathname  返回URL的目录和文件名
port  返回URL中指定的端口号
protocol  返回页面使用协议
search  返回URL的查询字符串【url地址后面携带的一些参数部分】,这个字符串以问号开头

2、location对象的一些相关方法:
assign(url)    【可返回上一个浏览页面】
打开新url,并会历史记录中添加一条记录
eg:

    //三者作用效果一样
window.location="https://www.cnblogs.com/nzcblogs/";
location.href="https://www.cnblogs.com/nzcblogs/"
location.assign("https://www.cnblogs.com/nzcblogs/");

replace(url)     【不可返回上一个浏览页面】
重新定位到url路径的页面上,不会在历史记录中添加新记录【类似重定向】

reload(boolean)    【重新加载当前显示的页面】
参数为布尔值:
false,表示以最有效方式重新加载,可能从缓存中直接加载 【默认值为false】
true,表示强制从服务器中重新加载【相当于使用了location、location.href、location.assign(url)重新打开url路径页面】

window.open(url)    在新选项卡中打开url页面

五、history对象
1、history对象的一些相关属性:
length  返回历史列表中的网址数
注意:IE和Opera从0开始,而Firefox、Chrome和Safari从1开始。

2、history对象的一些相关方法:
back()
加载历史列表中上一个 URL,这等同于在浏览器中点击后退按钮(向左的箭头)。

forward()
加载 history 列表中的下一个 URL,这等同于在浏览器中点击前进按钮(向右的箭头)

go(number)
加载 history 列表中的某个具体页面
参数为number类型:
正数表示向前跳转【number为1时,类似于forward()方法,加载下一个URL】
负数表示向后跳转【number为-1时,类似于back()方法,加载上一个URL】

js浏览器对象模型【BOM】(十三)的更多相关文章

  1. js浏览器对象模型-BOM

    bom browse object model 浏览器对象模型. 也就是window对象下面的东西. location 对象 window.location.href 表示打开窗口的路径. windo ...

  2. 浏览器对象模型BOM

    第二章 浏览器对象模型BOM 1.作用:操作窗口:提供导航对象:提供定位对象:浏览器上方的地址栏:提供跟屏幕相关对象:提供对Cookie的支持 2.根元素:window:代表整个窗口:window,o ...

  3. JavaScript高级程序设计(第3版)学习笔记·第8章——浏览器对象模型BOM

    转自:http://www.shaoqun.com/a/43768.aspx 访问和操作浏览器窗口的模型称为浏览器对象模型BOM(Browser Object Model),但习惯上是把所有针对浏览器 ...

  4. 浏览器对象模型BOM小结

    概念 BOM (Browser Object Model) 浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window B ...

  5. 浏览器对象模型BOM(Browser Object Model)

    1.结构 BOM是Browser Object Model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是w ...

  6. JavaScript编程:浏览器对象模型BOM

    4.浏览器对象模型BOM: document.body.offsetwidth可以获取浏览器宽度. Window对象:          窗口操作:            1.moveBy(dx,dy ...

  7. JavaScript 浏览器对象模型 (BOM)

    浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”. 浏览器对象模型 (BOM) 浏览器对象模型(Browser Object Model)尚无正式标准. 由于现代浏览器已经 ...

  8. 浏览器对象模型bom的作用是什么?

    浏览器对象模型bom的作用是什么? 零.总结 1.BOM提供了独立于内容而与浏览器窗口进行交互的对象 2.BOM提供了一些访问窗口对象的一些方法,我们可以用它来移动窗口位置,改变窗口大小,打开新窗口和 ...

  9. 浏览器对象模型(BOM)是什么?(体系结构+知识详解)(图片:结构)

    浏览器对象模型(BOM)是什么?(体系结构+知识详解)(图片:结构) 一.总结 1.BOM操作所有和浏览器相关的东西:网页文档dom,历史记录,浏览器屏幕,浏览器信息,文档的地址url,页面的框架集. ...

  10. js浏览器对象模型(BOM)

    浏览器对象模型(Browser Object Model,BOM):浏览器为js提供的对象集合. 1 windows对象 windows对象:表示浏览器的框架以及与其相关的内容,比如滚动条和导航栏图标 ...

随机推荐

  1. PHP将图片转base64格式函数

    base64的好处是什么?今天在跟小伙伴讨论这个问题,要是全站用Php把图片转为base64行不行? 1. 提升性能: 网页上的每一个图片,都是需要消耗一个 http 请求下载而来的, 图片的下载始终 ...

  2. 10 使用 OpenCV、Kafka 和 Spark 技术进行视频流分析

    问题引起 基于分布式计算框架Spark的室内防盗预警系统 首先用摄像头录一段视频,存在电脑里,下载一个ffmpeg的软件对视频进行处理,处理成一张张图片,然后通过hadoop里边的一个文件系统叫做hd ...

  3. redis主从+redis的哨兵模式

    三台机器分布 192.168.189.129  //  master的角色 192.168.189.130  //  slave1的角色 192.168.189.131  //  salve2的角色 ...

  4. [RN] React Native 实现图片预览

    [RN] React Native 实现图片预览 效果预览: 代码如下: 'use strict'; import React, {Component} from 'react'; import {I ...

  5. 2019 qbxt CSP-S考前冲刺班总结

    似乎--也没有太多好说的. ​ 但这是最后一次培训,因此还是应该写点什么的. ​ 记得状态最好的一次培训,是高一的第一次培训.那次是总共的第二次培训.第一次去的时候什么也不会,跟的非常吃力,每天都在疯 ...

  6. 【数位DP】【P2657】[SCOI2009]windy数

    Description windy定义了一种windy数.不含前导零且相邻两个数字之差至少为 \(2\) 的正整数被称为windy数. windy想知道, 在 \(A\) 和 \(B\) 之间,包括 ...

  7. Python内置函数---ord()

    描述: ord() 函数是 chr() 函数(对于8位的ASCII字符串)或 unichr() 函数(对于Unicode对象)的配对函数,它以一个字符(长度为1的字符串)作为参数,返回对应的 ASCI ...

  8. Git-push和pull分支

    查看分支信息:git branch -r 查看所有分支信息:git branch -a 本地推送分支:git push origin branch-name 推送分支前最好先pull分支:git pu ...

  9. 不用FTP,直接Windows与Linux下互传文件

    直接上传文件到Linux[1] Linux上输入命令:rz 直接下载Linux中的文件[2] 使用命令: sz 文件名 网上看到这个帖子,觉得很实用,转载保存 下载一个部署文件夹,到本地电脑 . 两步 ...

  10. 本地项目git初始化并提交远程仓库

    1.先在远程仓库(如github)创建项目,为了避免错误,不要初始化 README, license, 或者gitignore文件 . 2.打开Terminal终端 3.切换到你的本地项目目录 4.初 ...