资讯专栏INFORMATION COLUMN

学习BOM

xuweijian / 457人阅读

摘要:学前端要学学习要学我们现在来学习是浏览器对象模型窗口导航窗口对象是中的顶级对象,所有定义在全局作用域中的变量函数都会变成对象的属性和方法,在调用的时候可以省略。我们在控制台打印,控制台会输出很多属性,事实上,,,,,这几个属性也是下的属性。

BOM 学前端要学css html javascript 学习javascript要学 ecmascript(es3,es5,es6,es7) dom bom 我们现在来学习BOM

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

window(窗口)
navigator(导航)
location
screen
history
document

width(窗口)

window对象是js中的顶级对象,所有定义在全局作用域中的变量、函数都会变成window对象的属性和方法,在调用的时候可以省略window。我们在控制台打印 console.log(windows) ,控制台会输出很多属性,事实上,navigator , location , screen , history , document 这几个属性也是 window 下的属性。

1.打开与关闭
     打开 window.open(url,type) //type _self(当前窗口打开) _blank(默认 新窗口打开)
     关闭 window.close() 关闭窗口 (它只能关闭程序打开的窗口直接在地址栏输入地址打开的页面不适用。)
2.系统对话框
    alert() (系统弹窗)
    confirm() (确认,取消弹窗)
    prompt() (输入弹窗)
3.定时器
    setInterval clearInterval 间隔一段时间执行一次代码
    setTimeout clearTimeout 到指定一段时间后执行一次代码
navigator(导航)

包含大量有关Web浏览器的信息,在检测浏览器及操作系统上非常有用

navigator.userAgent(用来描述浏览器的一些版本信息,可以做浏览器的嗅探)
     
window.navigator.appCodeName //浏览器代码名
window.navigator.appName //浏览器步伐名
window.navigator.appMinorVersion //浏览器补钉版本
window.navigator.cpuClass //cpu类型x86
window.navigator.platform //操作体系类型win32
window.navigator.plugins
window.navigator.opsProfile
window.navigator.userProfile
window.navigator.systemLanguage //客户体系语言zh-cn简体中文
window.navigator.userLanguage //用户语言,同上
window.navigator.appVersion //浏览器版本(包括 体系版本)
window.navigator.userAgent//用户代理头的字符串表示
window.navigator.onLine //用户否在线
window.navigator.cookieEnabled //浏览器是否撑持cookie
window.navigator.mimeTypes
location(地址)

属性:

hostname 主机名(域名)
href(网址)
pathname 具体文件路径
hash 哈希("#"开始的文字)

方法:

reload 重新加载当前页面(刷新)

  location对象:表示载入窗口的URL,也可用window.location引用它
location.href //当前载入页面的完整URL
location.host //服务器的名字
location.pathname //URL中主机名后的部分,如/pictures/index.htm
location.hash //如果URL包含#,返回该符号之后的内容,如#anchor1
location.reload(true | false); //重新载入当前页面,为false时从浏览器缓存中重载,为true时从服务器端重载,默认为false
document.location.reload(URL) //打开新的网页  
screen (屏幕)
相当于css3 媒体查询
window.screen.width //屏幕宽度
window.screen.height //屏幕高度
window.screen.availWidth //可用宽度(除去任务栏的高度)
window.screen.availHeight //可用高度(除去任务栏的高度)  
history (历史)
history.back() //在浏览历史里后退一步
history.forward() //在浏览历史里前进一步
history.go(i) //到汗青详细登记单的第i位

h5里的history(history api):
pushState(a,b,c)//a:数据 c:地址栏
window.onpopstate  
document 文档
document.write() //动态向页面写入内容

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

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

相关文章

  • 基础巩固:JavaScript基础总结(基本概念篇)

    摘要:基础巩固基础总结使用已经好几年了,由于工作主要是做服务端开发,在工作中逐渐发现的使用范围原来越广泛。这里要注意,务必将基础部分掌握牢靠,磨刀不误砍柴功,只有将基础部分掌握并建立起系统的知识体系,在后面学习衍生的其他模式才能游刃有余。 基础巩固:JavaScript基础总结 使用JavaScript已经好几年了,由于工作主要是做服务端开发,在工作中逐渐发现JavaScript的使用范围原...

    YuboonaZhang 评论0 收藏0
  • JavaScript的组成 | DOM/BOM

    摘要:中主要关注的就是,对象的主要功能就是处理网页内容。中文翻译模型,如果你把这个词从中抽离出来,看下面的图片是不是就很好理解。年月制定的标准,由两大部分组成核心和。扩展鼠标和用户界面事件范围遍历,增加了对支持。 往期回顾 在上一期的《JavaScript的组成 | 核心-ECMAScript 》☜里,我们有说到JavaScript 是由三大部分组成,分别是:核心ECMAScript、文档对...

    worldligang 评论0 收藏0
  • JavaScript学习总结(三)BOM和DOM详解

    摘要:有级级级共个级别。事件类型事件类型鼠标事件键盘事件事件事件处理器执行代码的程序在事件发生时会对事件做出响应。在标签中使用事件处理器的语法是标签事件处理器代码事件处理程序事件就是用户或浏览器自身执行的某种动作。 DOM介绍 D(文档)可以理解为整个Web加载的网页文档,O(对象)可以理解为类似window对象只来的东西,可以调用属性和方法,这里我们说的是document对象,M(模型)可...

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

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

    2bdenny 评论0 收藏0

发表评论

0条评论

xuweijian

|高级讲师

TA的文章

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