隔了一段时间,现在开始看第8章。

第8章:BOM

  BOM提供了很多对象,用于访问浏览器的功能。BOM的核心对象是window,它表示浏览器的一个实例

  window对象是通过javascript访问浏览器窗口的一个接口,又是ECMAScript中的Global对象。

  所有在全局作用域声明的变量、函数都是window对象的属性和方法。

  1. 窗口关系,框架

    每个框架都有window对象,并在frames集合中

    每个window对象都有name属性,其中包含框架名称

    top对象始终指向最高(最外)层框架,也就是浏览器窗口

    parent对象始终指向当前框架的直接上层框架

    self对象始终指向window对象

  2. 窗口位置、视口大小

var leftPos = (typeof window.screenLeft == "number") ?   window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY; var pageWidth = document.compatMode == "CSS1Compat" ? document.documentElement.clientWidth : document.body.clientWidth;
var pageHeight = document.compatMode == "CSS1Compat" ? document.documentElement.clientHeight : document.body.clientHeight;

  3. 打开新窗口  

function openNewWindow(){
var win = window.open('http://www.a.com/', 'aWindow', 'width=300,height=300,left=10,top=10');
win.resizeTo(500,500);
win.moveTo(100,100);
//win.close();
//win.opener = null;
}

  4. 间隔调用 超时调用

//1秒后执行 只执行一次
var timeoutId = setTimeout(function() {
alert("Hello world!");
}, 1000);
//clearTimeout(timeoutId); //每间隔1秒执行一次,直到取消
var timer = setInterval(function() {
alert("Hello world!");
}, 1000);
//clearInterval(timer); //兼容 requestAnimationFrame 用法和setTimeout类似
if (!window.requestAnimationFrame) {
window.requestAnimationFrame = (window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.msRequestAnimationFrame ||
window.oRequestAnimationFrame ||
function (callback) {
return window.setTimeout(callback, 17);
});
}
if (!window.cancelRequestAnimationFrame) {
window.cancelRequestAnimationFrame = (window.cancelAnimationFrame ||
window.webkitCancelRequestAnimationFrame ||
window.mozCancelRequestAnimationFrame ||
window.msCancelRequestAnimationFrame ||
window.oCancelRequestAnimationFrame ||
window.clearTimeout);
}

  5. 系统对话框

//alert
alert('Hello world!');
//confirm
if(confirm('are you ok?')){
//yes
}else{
//no
}
//prompt
var result = prompt("What is your name? ", "");
if(result !== null) {
alert("Welcome, " + result);
}

  6. location对象

// http://www.a.com:1234/test.html?k1=v1&k2=v2#part2

location.hash	//URL的锚部分 ( #part2 )
location.hash='#hash' //不会重新加载
location.host //URL的主机名称和端口号 location.href //完整URL location.pathname //URL的路径部分 ( /test.html )
location.port //URL的端口部分 ( 1234 )
location.protocol //URL的协议 ( http ) location.search //URL的查询部分 ( ?k1=v1&k2=v2 ) location.assign //加载一个新的文档
window.location.assign("http://www.a.com")
window.location='http://www.a.com/';
location.href='http://www.a.com/';
location.reload //重新加载当前文档
location.reload() //重新加载 可能重缓存加载
location.reload(true) //重服务器重新加载
location.replace //用一个新文档取代当前文档
location.replace('www.a.com') //不会留下历史记录 不能点击后退返回上一个页面 //转到新URL
location.assign('www.a.com')
window.location='www.a.com';
location.href='www.a.com';

  7. navigator对象 

navigator.appName //名称
navigator.appVersion //版本
navigator.appCodeName //代码名称
navigator.platform //系统平台
navigator.cookieEnabled //是否启用cookies
navigator.userAgent //浏览器用户代理头的值(只读的字符串) if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
location.href="http://www.a.com/";
}else if(/iPad/i.test(navigator.userAgent)){
location.href="http://www.b.com/"
}else{
location.href="http://www.c.com/"
}

  8. history对象

back() //加载历史列表中的前一个URL(如果存在)等价于点击后退按钮或调用 history.go(-1)
forward() //加载历史列表中的下一个URL 等价于点击前进按钮或调用 history.go(1)
go() //加载历史列表中的某个具体的页面 //后退一页
history.back()
history.go(-1)
//前进一页
history.forward()
history.go(1)

第9章:客户端检测

   检测web客户端的方式很多,不到万不得已不要使用客户端检测,有更通用的方法就使用更通用的方法。

   最常用的客户端检测形式是能力检测(特性检测),判断浏览器是否支持某种特性。

//基本检测格式
if(object.property){
//use object.property
} //ie判断
var isIE = !!("ActiveXObject" in window);
var isIE6 = !document.addEventListener && !window.XMLHttpRequest;
var isIE7 = isIE && !!window.XMLHttpRequest && !document.documentMode;
var isIE8 = isIE && !document.addEventListener && !!document.documentMode; if( isIE6 ) alert('你使用的是ie6浏览器')
if( isIE7 ) alert('你使用的是ie7浏览器')
if( isIE8 ) alert('你使用的是ie8浏览器')

   在可能的情况下,尽可能使用 typeof 来检测。

   用户代理检测包含大量与浏览器有关的信息。 

var ua = navigator.userAgent;
if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(ua)){
location.href="http://www.a.com/";
}else if(/iPad/i.test(ua)){
location.href="http://www.b.com/"
}else{
location.href="http://www.c.com/"
}

  第8章主要介绍了浏览器的window对象,window对象下的各种方法、navigator对象history对象。第9章介绍怎样检查客户端,在平常为了兼容一般都要做这样的检测。根据浏览器是否支持某个特性来检测,根据浏览器的navigator.userAgent(用户代理信息)检测。

  

  

读书时间《JavaScript高级程序设计》四:BOM,客户端检测的更多相关文章

  1. 读书笔记 - javascript 高级程序设计 - 第一章 简介

      第一章 简介   诞生时间 1995 最初用途 客服端验证 第一版标准 注意是标准 1997年 Ecma-262  一个完整的js实现由三部分组成 ECMAScript DOM 文档对象模型 BO ...

  2. 读书笔记-JavaScript高级程序设计(1)

    1.组合继承 (JavaScript 中最常用的继承模式 ) (position: page168) (书中定义了两个变量名 SuperType   SubType  乍一看 感觉不太能区分,我将改为 ...

  3. 读书笔记 - javascript 高级程序设计 - 第二章 在Html中使用JavaScript

    1 <script>的6个属性 async  立即下载当前script标签的外部脚本 但不能影响别的 charset 没用了 defer  文档显示之后再执行脚本,只对外部脚本有效 lan ...

  4. JavaScript高级程序设计(四): 关键字With的使用

    一.关键字with 1.含义    with 语句可以方便地用来引用某个特定对象中已有的属性,但是不能用来给对象添加属性.要给对象创建新的属性,必须明确地引用该对象.   简单的说,with为一个或一 ...

  5. javascript 高级程序设计 四

    新的一天开始,让我们伴随者轻快的心情,开始今天的笔记 1.操作符: (1): *./.-在ECMAScript中操作的时候,如果遇到有一个操作值不是数值型(Number),那么就会在后台调用numbe ...

  6. 读书时间《JavaScript高级程序设计》一:基础篇

    第一次看了<JavaScript高级程序设计>第二版,那时见到手上的书,第一感觉真是好厚的一本书啊.现在再次回顾一下,看的是<JavaScript高级程序设计>第三版,并记录一 ...

  7. 《JavaScript高级程序设计》读书笔记--前言

    起因 web编程过程使用javascript时感觉很吃力,效率很低.根本原因在于对javascript整个知识体系不熟,看来需要找些书脑补一下,同时欢迎众网友监督. 大神推荐书籍 看了博客大神们推荐的 ...

  8. JavaScript高级程序设计学习(四)之引用类型

    在javascript中也是有引用类型的,java同样如此. javascript常见也比较常用的引用类型就熟Object和Array. 一个对象和一个数组,这个在前后端分离开发中也用的最多.比如aj ...

  9. 读书笔记(05) - 事件 - JavaScript高级程序设计

    HTML依托于JavaScript来实现用户与WEB网页之间的动态交互,接收用户操作并做出相应的反馈,而事件在此间则充当桥梁的重要角色. 日常开发中,经常会为某个元素绑定一个事件,编写相应的业务逻辑, ...

  10. 《Javascript高级程序设计》阅读记录(二):第四章

    这个系列之前文字地址:http://www.cnblogs.com/qixinbo/p/6984374.html 这个系列,我会把阅读<Javascript高级程序设计>之后,感觉讲的比较 ...

随机推荐

  1. 在CodeBlocks 开发环境中配置使用OpenCV (ubuntu系统)

    CodeBlocks是一个开放源代码的全功能的跨平台C/C++集成开发环境.CodeBlocks由纯粹的C++语言开发完毕,它使用了蓍名的图形界面库wxWidgets.对于追求完美的C++程序猿,再也 ...

  2. Ubuntu 8.04下安装DB2方法

    參考文献: How-to: Ubuntu 7.10 Server x86 32-bit and DB2 Express-C v9.5 DB2 v9.7 Infomation Center 场景:在IB ...

  3. ElasticSearch+Kibana 索引操作

    ElasticSearch+Kibana 索引操作 一 前言 ElasticiSearch 简介 ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引 ...

  4. PPTP和L2TP的区别

    PPTP是点到点的隧道协议,服务器端使用TCP 的1723端口,同时使用GRE协议,加密上使用MPPE.位于NAT后的客户端连接会有问题. L2TP是二层隧道VPN,使用IPsec 进行加密,服务器端 ...

  5. SVNKIT的low api应用之修改库中文件内容(File modification)

    最近在做一个仓库管理系统,架构在svn之上.要求每一项操作要记录在log文件中,弄了很久起初感觉无法向库中的文本文件添加东西,就是修改库中的文本文件.于是采用了一个很笨的办法:    现将库中的log ...

  6. python学习1(小白记录)

    python创建cocos2d-x项目注意点1. 2.7.5版本号的.配置好环境变量之后.要切换到tools文件夹下.直接运行 python create_project.py ..........这 ...

  7. RPC分布式处理

    RPC(远程过程调用)的应用 接触背景 因为工作上某项目的需要设计一种分布式处理耗时的运算,每个节点然后将运算结果返回给中心服务器,而最初未了解RPC这部分之前我的设计是在每一个RPC服务器上搭建一个 ...

  8. 解决:Could not find debuginfo pkg for dependency package glibc-2.12-1.132.el6_5.3.i686

    场景: (gdb) break main Breakpoint 1 at 0x8048417 (gdb) r Starting program: /usr/local/src/ccode/ch11/s ...

  9. 树上点对统计poj1741(树的点分治)

    给定一棵树,边上有权值,要统计有多少对点路径的权值和<=k 分治算法在树的路径中的应用 这个论文里面有分析. 任意两点的路径,要么过根结点,要么在子树中.如果在子树中,那么只要递归处理就行了. ...

  10. python关于for循环的几个函数

    1.enumerate:返回2个值,1是当前的for循环的第几轮,2是循环得到的数值 enumerate works by supplying a corresponding index to eac ...