day 47 BOM和DOM

 

原生js之BOM和DOM

BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行“对话”。

DOM (Document Object Model)是指文档对象模型,通过它,可以访问HTML文档的所有元素。

BOM

window对象

Window对象是客户端JavaScript最高层对象之一,由于window对象是其它大部分对象的共同祖先,在调用window对象的方法和属性时,可以省略window对象的引用。例如:window.document.write()可以简写成:document.write()。

每个浏览器都支持window对象,它表示浏览器窗口上图可见name属性封装到了window对象内,用window.属性名就可以直接查看了

*如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象(了解)。

*没有应用于 window 对象的公开标准,不过所有浏览器都支持该对象(了解)。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。全局函数是 window 对象的方法。

HTML DOMdocument 也是 window 对象的属性之一。

常用的Window方法:

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
window.open() - 打开新窗口
window.close() - 关闭当前窗口 (只能关闭用js的window.open()打开的页面,了解一下就行了)

window的子对象 

navigator对象(浏览器对象)

通过这个对象可以判定用户所使用的浏览器,包含了浏览器相关信息。

navigator.appName  // Web浏览器全称
navigator.appVersion  // Web浏览器厂商和版本的详细字符串
navigator.userAgent  // 客户端绝大部分信息
navigator.platform   // 浏览器运行所在的操作系统

screen对象(屏幕对象)

screen.availWidth - 可用的屏幕宽度
screen.availHeight - 可用的屏幕高度

history对象(历史对象)

    window.history 对象包含浏览器的历史。

 浏览历史对象,包含了用户对当前页面的浏览历史,但我们无法查看具体的地址,可以简单的用来前进或后退一个页面。

history.forward()  // 前进一页,其实也是window的属性,window.history.forward()//
history.back()  // 后退一页

location对象

window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面。

常用属性和方法:

location.href  获取当前网页的URL
location.href="URL" // 跳转到指定页面
location.reload() 重新加载页面,就是刷新一下页面

弹出框

可以在 JavaScript 中创建三种消息框:警告框、确认框、提示框

警告框

    警告框经常用于确保用户可以得到某些信息。

    当警告框出现后,用户需要点击确定按钮才能继续进行操作。

    语法:

alert("你看到了吗?");

确认框

    确认框用于使用户可以验证或者接受某些信息。

    当确认框出现后,用户需要点击确定或者取消按钮才能继续进行操作。

    如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false。

    语法:

confirm("你确定吗?")

猜你喜欢

转载自www.cnblogs.com/yanpeizhang/p/10559904.html
今日推荐