Javascript高级程序设计--读书笔记--第八章BOM

BOM（browser object model 浏览器对象模型)

BOM的核心对象是window，它表示浏览器的一个实例。在浏览器钟，window对象有双重角色，它既是通过javascript 访问浏览器窗口的一个接口，又是ECMAScript 规定的global 对象。这意味着在网页中定义的任何一个对象、变量和函数，都以window作为其Global 对象，因此有权访问parseInt()等方法。

全局变量

• 在全局作用域中声明的变量、函数都会变成window对象的属性和方法
• 定义全局变量与在window对象上直接定义属性还是有一点差别:全局变量不能通过delete操作符删除，而直接在window对象上定义的属性可以。
• 尝试访问未声明的变量会抛出错误，但是通过查询window对象，可以知道某个可能未声明的变量是否存在。

//这里会抛出错误，因为oldValue未定义
var newValue = oldValue
//这里不会抛出错误，因为这是一次属性查询
//newValue的值是undefined
var newValue = window.oldValue

间隔调用和超时调用

• setTimeout(args1,args2)

第一个参数可以是一个包含JavaScript代码的字符串，也可以是一个函数。

第二个参数是一个表示等待多长时间的毫秒数，但经过该时间后指定的代码不一定执行。Javascript 是一个单线程序的解释器，因此一定时间内只能执行一段代码。为了控制要执行的代码，就有一个Javascript任务队列。这些任务会按照将它们添加到队列的顺序执行。SetTimeout()的第二个参数告诉JavaScript再过多长时间把当前任务添加到队列中。如果队列是空的，那么添加的代码会立即执行；如果队列不是空的，那么它就要等前面的代码执行完了再执行。

• 取消超时调用clearTimeout(timeoutID)

var timeoutId = setTimeout(function){
    alert("hello world!")
},1000);
clearTimeout(timeoutId)

系统对话框

alert()

confirm()

prompt() 接受两个参数：要显示给用户的文本提示和文本输入域和默认值

//confirm实例
if(confirm("Are you sure?"){
    alert(" I'm so glad you're sure!");
}else{
    alert("I 'm sorry to hear you're not sure.");
}
//prompt实例
var result = prompt("What is your name?","");
if(result !== null){
    alert("Welcome,"+result);
}

Location对象

获得字符串参数

function getQueryStringArgs(){
    var qs = (location.search.length >0 ? location.search.substring(1) : ""),
    args = {},
    items = qs.length ? qs.split("&") :[],
    item = null,
    name = null,
    value = null,
    i = 0,
    len = items.length;
    for(i=0;i<len;i++){
        item = items[i].split("=");
        name = decodeURIComponent(item[0]);
        value = decodeURIComponent(item[1]);
        if(name.length){
            args[name] = value;
        }
    }
    return args
}

位置操作

• location.assign()  跳转页面,下面这三个方法效果一样

location.assign("http://www.wrox.com");
window.location = "http://www.wrox.com";
location.href = "http://www.wrox.com";

修改location对象的其他属性也可以改变当前加载的页面。以上的跳转都可以通过单击 “后退”按钮导航到前一个页面

location.replace() 调用该方法，用户不能回到前一个页面

location.reload() 重新加载当前显示的页面

location.reload() //重新加载（有可能从缓存中加载）
location.reload(true) //重新加载（从服务器重新加载）

history对象

history.go() 可以在用户的历史记录中任意跳转，可以向前也可以向后。这个方法接受一个参数，表示向后或向前跳转的页面数的一个整数值。

// 后退一页
history.go(-1)
// 前进一页
history.go(1)
//前进两页
history.go(2)
//等于history.go(1)
history.forward()
//等于history.go(-1)
history.back()