（1）window.open()

定义和用法

open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口

语法

window.open(URL,name,specs,replace) [默认填写url，name这两个参数值即可]
 
看一下代码编写：
 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>Document</title>

     <script>

         window.onload=function(){

             var oBtn=document.getElementById('btn');

             oBtn.onclick=function(){

                 window.open('http://baidu.com','_blank')

                 //参数一：url地址

                 //参数二：同a标签里面的target属性；有四个可选值：_blank(新窗口，默认) _self(当前窗口) _parent  _top

                 //一般用window.open()参数填写两个即可

             }

         }

     </script>

 </head>

 <body>

     <input type="button" value="click" id="btn">

 </html>

另外一种window.open()的用法，如下图：

（2）window.close()

定义和用法

close() 方法用于关闭浏览器窗口。

语法

window.close()

说明

方法 close() 将关闭有 window 指定的顶层浏览器窗口。某个窗口可以通过调用 self.close() 或只调用 close() 来关闭其自身。

在火狐浏览器中，只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭。这阻止了恶意的脚本终止用户的浏览器。

【此代码示例不演示】

（3）window.navigator.userAgent

定义：

获取当前浏览器版本

（4）window.location

定义：

获取当前页面的地址/网址

用法：

不光可以读、还可以写  　　例如：window.location='http://baidu.com' 即可转到指定页面
 
（5）document.documentElement.scrollTop(获取滚动条位置)
【通俗来讲就是：获取当前页面的滚动条纵坐标位置】
 
接下来对scrollTop进行详细说明：

1、各浏览器下 scrollTop的差异 
IE6/7/8： 
对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 ； 
对于有doctype声明的页面则可以使用 document.documentElement.scrollTop； 
Safari: 
safari 比较特别，有自己获取scrollTop的函数 ： window.pageYOffset ； 
Firefox: 
火狐等等相对标准些的浏览器就省心多了，直接用 document.documentElement.scrollTop ； 
2、获取scrollTop值 
完美的获取scrollTop 赋值短语 ： 
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

通过这句赋值就能在任何情况下获得scrollTop 值。 
仔细观察这句赋值，你发现啥了没？？ 
没错， 就是 window.pageYOffset  (Safari)   被放置在 || 的中间位置。 
因为当 数字0 与 undefine 进行 或运算时，系统默认返回最后一个值。即或运算中 0 == undefine ; 
当页面滚动条刚好在最顶端，即scrollTop值为 0 时。  IE 下 window.pageYOffset  (Safari) 返回为 undefine ，此时将window.pageYOffset  (Safari) 放在或运算最后面时， scrollTop 返回 undefine ,  undefine 用在接下去的运算就会报错咯。 
而其他浏览器 无论 scrollTop 赋值或运算顺序如何都不会返回 undefine.  可以安全使用.. 
所以说到头还是IE的问题咯. 杯具… 
精神有点恍惚，不知道有没有表达清楚。 
不过最后总结出来这句实验过OK，大家放心使用； 
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

 

documentElement 和 body 相关说明：

body是DOM对象里的body子节点，即 <body> 标签；

documentElement 是整个节点树的根节点root，即<html> 标签；

DOM把层次中的每一个对象都称之为节点，就是一个层次结构，你可以理解为一个树形结构，就像我们的目录一样，一个根目录，根目录下有子目录，子目录下还有子目录。

以HTML超文本标记语言为例：整个文档的一个根就是,在DOM中可以使用document.documentElement来访问它，它就是整个节点树的根节点。而body是子节点，要访问到body标签，在脚本中应该写：document.body。

以上说明参考自：https://www.cnblogs.com/YangJieCheng/p/8108216.html

 
关于scrollTop的详细用法，转到个人的另一篇文章（链接：https://www.cnblogs.com/ytraister/p/10953015.html）
 
（6）系统对话框
1》警告框：alert（‘内容’）　　　　　　  【没有返回值】
2》选择框：confirm（‘提问的内容’）　    【确认：返回true；取消：返回false】
3》输入框：prompt（）　　　　　　　   【确认：返回输入的内容；取消：返回null】
 
看一下代码编写：

JS——BOM操作（基本用法与实现：open()、close()、scrollTop等了解）的更多相关文章

  1. JS——BOM操作（点击按钮返回顶部案例：scrollTop的用法）

    点击按钮返回顶部案例: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  2. JS BOM操作

    Bom:浏览器对象模型(Browser Object Model,简称 BOM)提供了独立于内容而与浏览器窗口进行交互的对象.描述了与浏览器进行交互的方法和接口,可以对浏览器窗口进行访问和操作 (1) ...

  3. JS的BOM操作语法

    整理了一下JS的BOM操作语法,这里记录一下. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  4. day45:JS中的json&JS的BOM操作和DOM操作

    目录 1.补充:CSS中的弹性盒子 2.JS中json的序列化 3.JS中的BOM操作 3.1 location操作 3.2 计时器 4.JS中的DOM操作 4.1 创建标签 4.2 查找标签 4.3 ...

  5. 5、前端--js常量、变量、5种基本数据类型（number string boolean undefined object）、运算符、流程控制、三元运算符、函数、自定义对象、内置对象、BOM操作

    变量与常量 在JS中声明变量需要使用关键字 老版本 var(全部都是全局变量) 新版本 let(可以声明局部变量) # 推荐使用let(其实问题不大) 在JS中声明常量也需要使用关键字 const # ...

  6. JS中BOM操作知识点

    JS BOM window对象 全局变量和全局方法都归在window上 alert-comfirm-prompt 让alert .confirm等弹出框上的提示文字实现换行:\n // confirm ...

  7. JS组件系列——KnockoutJS用法

    前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...

  8. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  9. JS BOM简列

    JS BOM BOM 也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM 缺少规范,每个浏览器提供商又按照自己想法去扩展它,那么浏览器共有对象就成了事实的标准.所以,BOM 本身是没有 ...

随机推荐

  1. AMQP及RabbitMQ

    AMQPAMQP协议是一个高级抽象层消息通信协议,RabbitMQ是AMQP协议的实现.它主要包括以下组件: 1.Server(broker): 接受客户端连接,实现AMQP消息队列和路由功能的进程. ...

  2. 08--MOOC--C/C++ 根据年月日计算星期几

    计算任何一天是星期几的几种算法 一:常用公式 W = [Y-1] + [(Y-1)/4] - [(Y-1)/100] + [(Y-1)/400] + D Y是年份数,D是这一天在这一年中的累积天数,也 ...

  3. js document 触发按键事件

    // 键盘控制 var keyEvent = (function () { document.onkeydown = function (e) { if (e.keyCode === 38) { // ...

  4. jQuery实现菜单全选/不选

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. [bzoj3291] Alice与能源计划 (二分图最大匹配)

    传送门 Description 在梦境中,Alice来到了火星.不知为何,转眼间Alice被任命为火星能源部长,并立刻面临着一个严峻的考验.为 了方便,我们可以将火星抽象成平面,并建立平面直角坐标系. ...

  6. datawhale爬虫实训4

    DataWhale-Task4(爬取丁香园2) 任务:使用lxml爬虫帖子相关的回复与部分用户信息(用户名,头像地址,回复详情) 难点:需要登录才能看到所有回复 浏览器登录上去,查看cookies信息 ...

  7. 1.git的安装和配置

    从git官网下一个git安装包.   点击git.exe安装程序,点击[next]   点击[next]   根据自己的需要可以把需要安装软件全选上,点击[next]   由于这是个人使用所以选择第二 ...

  8. Java Web学习总结（22）——使用kaptcha生成验证码

    kaptcha是一个简单好用的验证码生成工具,通过配置,可以自己定义验证码大小.颜色.显示的字符等等.下面就来讲一下如何使用kaptcha生成验证码以及在服务器端取出验证码进行校验. 一.搭建测试环境 ...

  9. php7 使用imagick 的坑

    imagick是一个PHP的扩展,用ImageMagick提供的API来进行图片的创建与修改,不过这些操作已经包装到扩展imagick中去了,最终调用的是ImageMagick提供的API. Imag ...

  10. C#中数组的使用

    1.简单数组: 声明: int[] myArray 初始化: 声明了数组后,就必须为数组分配内存来保存数组的全部元素.特别注意的是数组是引用类型.故须要使用new运算符来指定数组中元素的类型和数量来初 ...