JS(五)：JS的window对象之window相关方法、定时器

BOM（浏览器对象模型），可以对浏览器窗口进行访问和操作。使用BOM，开发者可以移动窗口、改变状态栏中的文本以及执行其他与页面内容不直接相关的动作。

即：使JS可以与浏览器“对话”；

一、window对象

所有浏览器都支持window对象。

概念上讲，一个html文档对应一个window对象。

功能上讲：控浏览器窗口的；

使用上讲：window对象不需要创建对象，直接使用即可。

二、window对象的方法

1.alert():因为window对象是全局的，所以alert方法可以直接写alert()，也可以使用window.alert()；

 window.alert("hello");//效果：弹出框提示，弹出框内有【确认】按钮，没有返回值

2.confirm():弹出框提示文本，确认、取消后有返回值boolean类型

 var ret=window.confirm("文本");//效果：弹出框提示，弹出框内有【确认】和【取消】按钮，操作两个按钮之一后，有返回值：boolean类型console.log(ret);//点击【确认】返回true;点击【取消】返回false；

3.prompt():弹出框提示文本，包含【输入框】、【确认】、【取消】，输入内容后，点击【确认】返回输入值；若点击【取消】返回null

 var res=window.prompt("文本");console.log(res);

4.open():打开链接、

close():关闭窗口

//4.open():打开链接
//window.open("http://www.baidu.com");
//close():关闭窗口
//window.close();

5.setInterval()、clearInterval()这个两个方法是一对；间隔执行某个函数；轮播图就是用这个方法

setInterval(f,1000);//间隔1000ms执行一个f()函数；function f() {console.log("hello")}

举例：计时器：需求描述：点击输入框，显示时间，并且每1s向后走；点击停止按钮后，即：停止在点击的时间；

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>#id1{width: 200px;height: 50px;}</style>
</head>
<body>
<input type="text" id="id1" onclick="begin()"><!--input输入框，点击事件触发begin()函数-->
<button onclick="end()">停止</button><!--停止按钮，点击事件触发end()函数 -->
<script>function show_time(){var current_time=new Date().toLocaleString();<!-- 定义变量current，属于 Date对象，以字符串显示-->var ele=document.getElementById("id1");<!-- 以id的方式找到id1元素 赋值ele-->ele.value=current_time;<!--给id1的value属性值赋值current_time -->}var clock1;function begin() {if (clock1==undefined){<!-- 这个if语句是放置多次点击input输入框，触发多个计时器，导致bug-->show_time();clock1=setInterval(show_time,1000);<!--调用show_time函数，频率1000ms-->}}function end() {clearInterval(clock1);<!--清除定时器-->clock1=undefined;<!--重新初始化，使得点击停止后，再次点击输入框，同样能显示时间-->}</script></body>
</html>

6.setTimeout、clearTimeout():在指定的毫秒后调用一个函数；

JS(五)：JS的window对象之window相关方法、定时器相关推荐

day04【JS高级】BOM对象、Window对象、二种定时器、 Location对象、DOM对象、DOM获取元素、DOM操作内容、DOM操作属性、DOM操作样式、DOM操作元素（标签）、正则表达式
回顾 1. js基础语法运算符:算数运算符可以与字符串进行数学运算,js底层进行隐式转换比较运算符:===(恒等) 特点,比较类型+内容流程控制语句if判断条件表达式:1)布尔2)数值:非0为真3)字 ...
BOM：window对象的方法之定时器setTimeout()和停止setTimeout()定时器
window对象提供了两个好用的方法:定时器,分别是: - setTimeout() - setInterval() window.setTimeout(调用函数,[延迟的毫秒数]); 毫秒数如果不写 ...
js中WINDOW对象
全栈工程师开发手册 (作者:栾鹏) js系列教程6-BOM操作全解 js中WINDOW对象 BOM的核心是window,而window对象又具有双重角色,它既是通过js访问浏览器窗口的一个接口,又是一 ...
js的window对象与属性的使用
1.BOM的概述 browser object modal :浏览器对象模型. 浏览器对象:window对象. Window 对象会在 <body> 或 <f ...
JavaScript window 对象详解
1. 概述 window对象指当前的浏览器窗口,它也是当前页面的顶层对象,即最高一层的对象,所有其他对象都是它的下属. 一个变量如果未声明,那么默认就是顶层对象的属性. // a是一个没有声明就直接 ...
Window对象的属性
Window对象的window和self属性都指代当前窗口对象本身.可以使用这两个属性来显示引用当前窗口. 一.Location 对象 Location对象包含有关文档当前位置的信息. Locatio ...
JavaScript 基础（十三）：Window对象
2019独角兽企业重金招聘Python工程师标准>>> 一. window对象简介 window 对象是 BOM(浏览器对象模型) 的核心,window对象指当前的浏览器窗口. w ...
APIS（BOM）——Window对象、本地存储
Window对象 BOM Window对象定时器-延时函数 js执行机制同步任务异步任务执行机制 location对象 navigator 对象 histroy 对象本地存储本地存储分类 ...
Window对象的说明》
Window对象 BOM(浏览器对象模型) 定时器-延时函数 JS执行机制 location对象 navigator对象 histroy对象 BOM(浏览器对象模型) BOM 1. navigator ...

JS(五)：JS的window对象之window相关方法、定时器

一、window对象

二、window对象的方法

JS(五)：JS的window对象之window相关方法、定时器相关推荐

最新文章

热门文章