BOM 浏览器对象模型

BOM (浏览器对象模型),它提供了与浏览器窗口进行交互的对象

一、window对象

Window对
象表示整个浏览器窗口。

1.系统消息框 alert()

alert('hello world!');

2.确认对话框 confirm() 

该方法返回一个boolean值,如果点击ok返回true,点击cancel返false;

if(confirm("确定要删除吗?")){

  //删除
}

3.输入对话框 prompt()

如果点击ok将文本框中的值作为函数值返回,如果点击cancel返回null

//如果用户不输入任何值或点击取消,那么脚本会一直弹出对话框
function requiredPrompt() {
while(true) {
var name = prompt("ssss");
if(name != null && name != "") {
console.log(name);
break;
}
}
}

4. 打开新窗口 window.open()

window.open("http://www.baidu.com","_blank","width=300, height=200");

5.定时器setInterva() 、 setTimeout() 

定时器可以说是js前端最常用的工具,几乎所有的逐渐变化的动态效果都会使用到定时器,比如 说图片滚动,渐隐渐现,拖拽等等.定时器分两种分别是settimeout和setinterval.

window.setInterval(); //设置循环定时器
var T = window.setInterval(test,1000); // test:执行的代码串或函数 设置1000毫秒
window.clearInterval(); //清除循环定时器
window.clearInterval(T);
window.setTimeout(); //设置单次定时器
var T = setTimeout(test,1000); // test:执行的代码串或函数 设置1000毫秒
window.clearTimeout() // 清除单次定时器
clearTimeout();

二、history对象

history对象是window对象的子对象,对应于浏览器的 历史记录。

window.history.go(-1);//跳转前一个页面
window.history.go(1);//跳转下一个页面
history.back();//跳转前一个页面
history.forward();//跳转下一个页面

三、Location对象

Location对象也是window对象的子对象,通过它可以获取或设置浏览器的当前地址。

1.跳转到其它页面

window.location.href = "http://www.163.com";
location.href = "http://www.163.com";

2.重新载入页面(刷新) 

location.reload(); 

四、navigator对象 

Navigator对象包含着有关web浏览器的信息,它也是window的属性,可以用 window.navigator 引用它,也可以用navigator引用

例:获取浏览器内部代号,名称,操作系统等信息

var info = navigator.userAgent;
alert(info);

效果图如下

Javascript初学篇章_6(BOM)的更多相关文章

  1. Javascript初学篇章_5(对象)

    对象 Javascript是一种面向对象的语言,因此可以使用面向对象的思想来进行javascript程序设计对象就是由一些彼此相关的属性和方法集合在一起而构成的一个数据实体.举个例子,一只猫是个对象, ...

  2. Javascript初学篇章_1(概念/数据类型)

    Javascript是一门脚本语言,主要由浏览器来执行.它可以说是页面的灵魂,让页面活过来.与之前学的HTML5+CSS样式的不同之处就在于,JS能让静态网页成为一个动态网页,实现与用户的互动. Ja ...

  3. Javascript初学篇章_4(循环与函数)

    七.循环语句 1.While 语法: while (exp){ //statements; } 说明: while (变量<=结束值){ 需执行的代码 } 例: var i=0; while(i ...

  4. Javascript初学篇章_3(注释/if/switch)

    五.javascript的注释 // 单行注释 /* …*/ 多行注释 注:多行注释不能互相嵌套 六.程序流程控制 一.条件语句 if 语法: if(condition) statements1 el ...

  5. Javascript初学篇章_8(事件)

    事件 HTML 事件是发生在 HTML 元素上的事情.例如用户点击按钮时,点击也是一个事件.事件可以用于处理表单验证,用户输入,用户行为及浏览器动作,如: 页面加载时触发事件 页面关闭时触发事件 用户 ...

  6. Javascript初学篇章_7(DOM)

    DOM 文档对象模型DOM (document object model) 文档对象模型,它定义了操作文档对象的接口.DOM 把一份html文档表示为一棵家谱树,使用parent(父), child( ...

  7. Javascript初学篇章_2(数据类型的查看和转换/运算符)

    三.数据类型的查看和转换 1.查看数据类型 typeof 说明:typeo可以查看变量的类型. 语法:alert(typeof  变量名或数据): 2.转换成字符串 var married = fal ...

  8. CSS3初学篇章_6(自定义动画)

    自定义动画 由于有一部分低版本的浏览器并不支持的问题,所以这个样式要多做兼容,各大浏览器兼容前缀如下: 前缀 浏览器  -webkit  chrome和safari  -moz  firefox  - ...

  9. JavaScript大杂烩9 - 理解BOM

    毫无疑问,我们学习JavaScript是为了完成特定的功能.在最初的JavaScript类型系统中,我们已经分析过JavaScript在页面开发中充当着添加逻辑的角色,而且我们知道JavaScript ...

随机推荐

  1. [Sass]混合宏

    [Sass]混合宏-声明混合宏 如果整个网站中有几处小样式类似,比如颜色,字体等,在 Sass 可以使用变量来统一处理,那么这种选择还是不错的.但当你的样式变得越来越复杂,需要重复使用大段的样式时,使 ...

  2. maven集成tomcat插件以及乱码解决

    Maven已经是Java的项目管理标配,如何在JavaEE开发使用Maven调用Web应用,是很多同学关心的问题.本文将介绍,Maven如何介绍Tomcat插件. Maven Tomcat插件现在主要 ...

  3. cron(CronTrigger)表达式用法

    CronTrigger CronTriggers往往比SimpleTrigger更有用,如果您需要基于日历的概念,而非SimpleTrigger完全指定的时间间隔,复发的发射工作的时间表.CronTr ...

  4. 测试css

    <h1>shell使用指南</h1> <h2>ZMODEM功能</h2> <pre><code>yum install lrzs ...

  5. android Sqlite小记

    1.android.database.sqlite.SQLiteException: near "": syntax error (code 1): 语法错误,如果你的报了这个错误 ...

  6. iOS-APP提交上架流程(新手必看!2016年3月1日最新版)

    自己的经验总结,有错的话请留言,第一时间更改. 先大概说一下iOSAPP上架的几个步骤(详细步骤见下图): 创建证书请求文件 登录苹果开发者中心生成发布者证书(下载下来要双击一下) 设置APPID(要 ...

  7. Java面试常见知识点总结(二)

    11.构造方法(构造器): 构造方法是一种特殊的方法,具有以下特点.    (1) 构造方法的方法名必须与类名相同.    (2) 构造方法没有返回类型,也不能定义为void,在方法名前面不声明方法类 ...

  8. jQuery获取输入框并设置焦点

    $(':input:enabled:visible:first').focus(); $("input:text:visible:first").focus(); 表单元素选择器: ...

  9. I Could Have Danced All Night

    百老汇著名音乐剧<窈窕淑女(My Fair Lady)>中脍炙人口的经典歌曲. Bed, bed ,I couldn't go to bed床,床,我不能上床去 My head's too ...

  10. AVL树的平衡算法(JAVA实现)

      1.概念: AVL树本质上还是一个二叉搜索树,不过比二叉搜索树多了一个平衡条件:每个节点的左右子树的高度差不大于1. 二叉树的应用是为了弥补链表的查询效率问题,但是极端情况下,二叉搜索树会无限接近 ...