8.1 window对象
BOM对象的核心是window,表示浏览器的一个实例。
在浏览器中,window既是javascript访问浏览器的一个接口,又是ECMAScript规定的global对象。
8.1.1 全局作用域
8.1.2 窗口关系和框架
如果页面中包含框架,则每个框架都有自己的window对象,保存在frames集合中。
可以通过window.frames[0]或window.frames[framesName]来引用。但最好使用top。
8.1.3 窗口位置
moveTo() 接收新位置的x和y坐标值
moveBy() 接收新位置的水平和垂直方向上移动的像素值
注:可能会被浏览器禁用
不适应框架,只能对最外层的window对象使用
8.1.4 窗口大小
//取得页面视口大小的方法 var pageWidth = window.innerWidth, pageHeight = window.innerHeight; if (typeof pageWidth != "number"){ //检查pageWidth保存的是否为数值 if (document.compatMode == "CSS1Compat"){ //如果不是,检查document.compatMode确认页面是否处于标准模式 pageWidth = document.documentElement.clientWidth; pageHeight = document.documentElement.clientHeight; } else { pageWidth = document.body.clientWidth; pageHeight = document.body.clientHeight; } } alert("Width: " + pageWidth); alert("Height: " + pageHeight);risizeTo() 接收浏览器窗口的新宽度和高度
resizeBy() 接收新窗口与原窗口的宽度和高度之差。
注:可能会被浏览器禁用
不适应框架,只能对最外层的window对象使用
8.1.5 导航和打开窗口
window.open()调用close()方法可以关闭打开的窗口
wroxWin.close()
8.1.6 间歇调用和超时调用
setTimeout()
clearTimeout()
//不要传递字符串,会影响性能 setTimeout("alert('Hello world!') ", 1000); //推荐调用方式 setTimeout(function() { alert("Hello world!"); }, 1000);
//设置超时调用 var timeoutId = setTimeout(function() { alert("Hello world!"); }, 1000); //把它取消 clearTimeout(timeoutId);
setInterval()
clearInterval()
8.1.7 系统对话框
alert() 接受一个字符串显示出来
confirm() 警告对话框,有确认取消选择
prompt() 提示框,提示用户输入文本
8.2 location对象
既是window对象的属性,也是document对象的属性 window.location==document.location
8.2.1 查询字符串参数
location.search返回从问号到url末尾的内容,不能逐个访问其中的每个查询字符串参数。
function getQueryStringArgs(){ //取得查询字符串并去掉开头的? var qs = (location.search.length > 0 ? location.search.substring(1) : ""); //保存数据的对象 var args = {}; //取得每一项 var items = qs.split("&"); var item = null, name = null, value = null; //依次将每一项添加到args对象中 for (var i=0; i < items.length; i++){ item = items[i].split("="); name = decodeURIComponent(item[0]); value = decodeURIComponent(item[1]); args[name] = value; } return args; } //假如查询字符串是 ?q=javascript&num=10 var args = getQueryStringArgs(); alert(args["q"]); //"javascript" alert(args["num"]); //"10"
8.2.2 位置操作
一般使用location.href()
但是通过location.href会是浏览器中生成一条新记录,因此用户单击“后退”按钮都会导航到前一个页面,要禁用这种行为,可以使用location.replace方法。
location.reload(); //重新加载(有可能从缓存中加载)
location.reload(true); //重新加载(从服务器重新加载);
最好将reload()放在代码的最后一行
8.3 navigator对象
识别客户端的事实标准
8.3.1 检测插件
非ie用plugins数组,包含的属性
name:插件名
description: 插件描述
filename: 插件的文件名
length: 插件所处理的MIME类型数量
//检测插件,在ie中无效 function hasPlugin(name){ //要检查的插件名 name = name.toLowerCase(); //将传入的名称转换为小写,方便比较 for (var i=0; i < navigator.plugins.length; i++){//迭代plugins数组 if (navigator.plugins[i].name.toLowerCase().indexOf(name) > -1){ //通过indexOf()检测每个name属性,以确认传入的name是否出现在字符串的某个地方避免混淆 return true; } } return false; } //检测 flash alert(hasPlugin("Flash")); //检测 quicktime alert(hasPlugin("QuickTime")); //检测 Java alert(hasPlugin("Java"));
//检测ie中的插件 function hasIEPlugin(name){ try { new ActiveXObject(name); return true; } catch (ex){ return false; } } //检测 flash alert(hasIEPlugin("ShockwaveFlash.ShockwaveFlash")); //检测 quicktime alert(hasIEPlugin("QuickTime.QuickTime"));针对每个插件分别创建检测函数