资讯专栏INFORMATION COLUMN

js中BOM知识概览

z2xy / 1601人阅读

摘要:既是访问浏览器的接口,也是的全局对象小知识与定义的变量的区别定义的变量可通过删除。访问方法可能有通过数组下标或来访问,也可通过来访问小知识最高层窗口只有通过打开才会有否则没有窗口位置等属性等方法详情可自己查询。

1 window

window既是js访问浏览器的接口,也是ECMAScript的全局对象

小知识:var testwindow.test定义的变量的区别:

window.test定义的变量可通过 delete window.test 删除。

访问时:当没有定义test时可能会报错,但是通过window.test访问即使没定义也不会报错(因为相当于一次查询)

1.1 窗口关系(frame)

一个页面可能有多个frame,每个frame对应一个window对象,这就涉及到访问相应frame的window对象的问题。

访问方法可能有:通过数组下标 (window.frames[0]window.frames["framename"])来访问,也可通过window.top, window.parent,window.self来访问

小知识:最高层窗口只有通过window.open 打开才会有name否则没有name 
1.2 窗口位置

screenTopscreenLeft等属性
moveTo,moveBy等方法
详情可自己查询。

1.3 窗口大小

innerWidth,innerHeight
outerWidth,outerHeight
clientWidth,clientHeight等属性
resizeTo()等方法

1.4 窗口打开及关闭

var win=window.open("URL","name","各种参数设置")

注意:

 - 第二个参数还可以是"_blank","_parent","_self","_top"
         
 - 第三个参数是:width等还有resizable等参数的设置
 
 - 当有些浏览器设置弹出窗口屏蔽时,返回的win就是null

win.close()

win.opener=null 设置新打开的标签页运行在独立进程中运行,不需与打开其的标签页进行通信

注意:打开窗口涉及到安全限制的问题。
2 location

获取URL相关信息。

 常用如下:

     - 获取URL:location.href

     - 获取hash:location.hash
     
     - 获取查询字符串:location.search
     
     (还有hostName,host,pathName等)
     
     hash和查询字符串的区别可浏览:[https://segmentfault.com/n/1330000009872432][1]
     

assign(URL)方法:改变浏览的页面(与href赋值效果一样)
replace(URL)方法:修改URL且不会留下浏览记录
reload()方法:重新加载当前页面(默认从缓存中加载),当参数为true时会强制从服务器加载。最好放在代码最后一行。

3 navigator

获取浏览器信息,通常用于检测浏览器类型

navigator.plugins(可用来检查插件)
navigator.appName
navigator.appVersion

4 screen

通常用作测定客户端能力的站点跟踪工具中(站点分析)

availHeight

5 history

go()
back()
forward()
length属性

6 设置时间函数

var timeoutid=setTimeout(function(){},1000)
clearTimeout(timeoutid)
var timeinteid=setInterval(function(){},1000)
clearInterval(timeoutid)

7 各种弹出框

alert()
confirm("message") 返回truefalse
prompt("message",""defaultValue) 返回输入的内容或null

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/88316.html

相关文章

  • JavaScript - 收藏集 - 掘金

    摘要:插件开发前端掘金作者原文地址译者插件是为应用添加全局功能的一种强大而且简单的方式。提供了与使用掌控异步前端掘金教你使用在行代码内优雅的实现文件分片断点续传。 Vue.js 插件开发 - 前端 - 掘金作者:Joshua Bemenderfer原文地址: creating-custom-plugins译者:jeneser Vue.js插件是为应用添加全局功能的一种强大而且简单的方式。插....

    izhuhaodev 评论0 收藏0
  • 【连载】前端个人文章整理-从基础到入门

    摘要:个人前端文章整理从最开始萌生写文章的想法,到着手开始写,再到现在已经一年的时间了,由于工作比较忙,更新缓慢,后面还是会继更新,现将已经写好的文章整理一个目录,方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理 从最开始萌生写文章的想法,到着手...

    madthumb 评论0 收藏0
  • 前端应该知道的基本知识

    摘要:所有我们不熟悉或者没有掌握的知识皆可称之为知识盲区,有知识盲区并不可怕,针对知识盲区去学习即可。只有这样,我们才会准确知道自己的知识盲区所处何处,以及发现更多的知识盲区。节点对应的对象是,其他的具体节点对象全都是继承自对象。 前端时间在部门内进行分享,准备素材时偶然发现下面的一个现象,因为和当时分享的主题无关,就先记下来了,事后重新审视,并把一些思考记录如下: 一、问题 HTML: ...

    2bdenny 评论0 收藏0
  • 前端知识点总结——BOM

    摘要:何时只要让程序延迟执行一件事时如何件事启动定时器让程序等待毫秒后,自动执行一次,执行后自动停止停止定时器定时器原理定时器中的任务函数,必须等待主程序所有语句执行后,才能执行。将事件监听对象加入到浏览器的监听队列中。 前端知识点总结——BOM 1.BOM: Browser Object Model 什么是: 专门操作浏览器窗口的API 没有标准, 导致浏览器兼容性问题 包括: w...

    BoYang 评论0 收藏0

发表评论

0条评论

z2xy

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<