资讯专栏INFORMATION COLUMN

《JavaScript高级程序设计》笔记:BOM(八)

mushang / 1068人阅读

摘要:浏览器对象模型提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关。对象基本上只用来表明客户端的能力。

BOM(浏览器对象模型)提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关。

window对象 全局作用域

定义全局变量与在window对象上直接定义属性还是有一点差别:全局变量不能通过delete操作符删除,而直接在window对象上的定义的属性可以。

var age = 29;
window.color = "red";

delete window.age;
delete window.color;

console.log(window.age); //29
console.log(window.color); // undefined
窗口关系及框架

window.top: 指定最高(最外)层的框架
window.parent:指向当前框架的直接上层框架,在某些情况下,parent有可能等于top

窗口位置

使用下列代码可以跨浏览器取得窗口左边和上边的位置:

var leftPos = (typeof window.screenLeft =="number" )? window.screenLeft : window.screenX;

var topPos = (typeof window.screenTop =="number") ? window.screenTop:window.screenY;

console.log(leftPos);
console.log(topPos);
窗口大小

虽然无法确定浏览器窗口本身的大小,但却可以取得页面视口的大小。

var pageWidth = window.innerWidth,
    pageHeight = window.innerHeight;

if (typeof pageWidth != "number") {
    if (document.compatMode == "CSS1Compat") {
        pageWidth = document.documentElement.clientWidth;
        pageHeight = document.documentElement.clientHeight;
    } else {
        pageWidth = document.body.clientWidth;
        pageHeight = document.body.clientHeight;
    }

}

console.log(pageWidth);
console.log(pageHeight);
location对象
// 将url 修改为"http://www.wrox.com/WileyCAD/#section1"
location.hash = "#section1";

// 将url 修改为"http://www.wrox.com/WileyCAD/?q=javascript"
location.search = "?q=javascript";

// 将url 修改为"http://www.yahoo.com/WileyCAD/"
location.hostname = "www.yahoo.com";

// 将url 修改为"http://www.yahoo.com/mydir/"
location.pathname= "mydir";

// 将url 修改为"http://www.yahoo.com:8090/mydir/"
location.port= 8090;
location.reload(); // 重新加载(有可能从缓存中加载)
location.reload(true); // 重新加载(从服务器重新加载)
navigator对象 检查插件
// 检测插件(在IE中无效)
function hasPlugin(name){
    name = name.toLowerCase();
    for (var i=0; i-1){
            return true;
        }
    }

    return false;
}

// 检测flash
console.log(hasPlugin("Flash"));


// 检测IE中的插件
    function hasIEPlugin(name){
        try{
            new ActiveXObject(name);
            return true;
        }catch(ex){
            return false;
        }
    }
    
    // 检测flash
    alert(hasIEPlugin("ShockwaveFlash.ShockwaveFlash"));
screen对象

javascript中有几个对象在编程中用处不大,而screen对象就是其中之一。screen对象基本上只用来表明客户端的能力。

history对象
history.go(-1); // 后退一页
history.go(1); // 前进一页
history.go(2); // 前进两页

history.back(); // 后退一步
history.forward(); //前进一步

//确定用户是否一开始就打开了你的页面
if(history.length == 0) {
    // 这应该是用户打开窗口后的第一个页面
}

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

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

相关文章

  • JavaScript高级程序设计学习笔记一(JavaScript简介)

    摘要:在上百种语言中算是命好的一个,还有就是最近纳入高考体系的。由以下三个部分构成。就是对实现该标准规定的各个方面内容的语言的描述。是针对但经过扩展的用于的应用程序编程接口。将页面映射为由节点构成的树状结构。 JavaScript的历史这里就不再赘述了,当然JavaScript的历史还是比较有意思的。在上百种语言中JavaScript算是‘命’好的一个,还有就是最近纳入高考体系的python...

    supernavy 评论0 收藏0
  • 001-读书笔记-JavaScript高级程序设计 JavaScript简介

    摘要:由于计算机的国际化,组织的标准牵涉到很多其他国家,因此组织决定改名表明其国际性。规范由万维网联盟制定。级标准级标准是不存在的,级一般指的是最初支持的。 这篇笔记的内容对应的是《JavaScript高级程序设计(第三版)》中的第一章。 1.ECMA 和 ECMA-262 ECMA 是欧洲计算机制造商协会的缩写,全程是 European Computer Manufacturers Ass...

    masturbator 评论0 收藏0
  • JS高级程序设计(1-3章)-笔记

    摘要:写在前面本文记录的是我不熟悉或者我认为值得注意的地方,并不是书上知识点的概括。再就是画图这种。与浏览器没有依赖关系。 写在前面 本文记录的是我不熟悉或者我认为值得注意的地方,并不是书上知识点的概括。 第1章 JavaScript简介 JS诞生时间:1995年(好年轻...) JS诞生背景:表单数据合法性由服务端验证的用户体验不好,希望能在客户端进行验证 JS现在用处:如果没有...

    Cristic 评论0 收藏0
  • JavaScript高级程序设计笔记:变量、作用域、内存问题

    摘要:作用域链中的下一个变量对象来自包含外部环境,而再下一个变量对象则来自下一个包含环境。这样,一直延续到全局执行环境全局执行环境的变量对象始终都是作用域链中的最后一个对象标识符解析沿作用域链一级一级搜索标识符。 一、写在前面 最近研究了创建Android虚拟机、vscode结合weex开发Android APP、Vmware装MAC虚拟机的事,看的内容不够多,接下来加油 二、变量、作用域和...

    U2FsdGVkX1x 评论0 收藏0
  • JavaScript学习笔记系列(一)

    摘要:只是浏览器只是实现可能的宿主环境之一,其他宿主环境包括和。级别级由两个模块组成核心和。有效不推荐有一点必须注意,即用操作符定义的变量将成为定义该变量的作用域的局部变量。会返回判断相等符认为两者相等。显示因此尽量避免这样运算。 一:JavaScript组成部分 JavaScript是由三个不同部分组成的,核心(ECMAScript) 、文档对象模型(DOM)和浏览器对象模型(BOM)。 ...

    Andrman 评论0 收藏0

发表评论

0条评论

mushang

|高级讲师

TA的文章

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