计时器javascript
setTimeout和setInterval能够用来注册在指定时间只有单次或重复调用的函数,由于它们都是客户端javascript中重要的全局函数,因此定义为window对象的方法,但做为通用函数,其实不会对窗口作什么事情html
它们返回一个值,这个值能够传递给clearTimeout()用于取消这个函数的执行java
因为历史缘由,setTimeout()和setInterval()的一个参数能够做为字符串传入。若是这么作,那这个字符串会在指定的超时时间或间隔以后进行求值(至关于执行eval)jquery
若是以0毫秒的超时时间来调用setTimeout(),那么指定的函数不会当即执行。相反会把它放到队列中,等到前面处于等待状态的事件处理程序所有执行完成后,再当即调用它web
function test(){ console.log("1"); setTimeout(function(){console.log("2");},0); console.log("3"); } test(); //1 //3 //2
Window对象的location属性引用的是location对象,它表示该窗口当前显示的文档的URL,并定义了方法来使窗口载入新的文档数组
Document对象的location属性也引用到Location对象;浏览器
console.log(window.location===document.location);//true
Document对象也有一个URL属性,是文档首次载入后保存该文档的URL的静态字符串。若是定位到文档中的片断标识符(如#table-of-contents),Location对象会作相对应的更改,document.URL属性却不会改变。函数
解析URl工具
window对象的location属性引用的是Location对象,它表示该窗口中当前显示的文档的URL。location对象的href属性是一个字符串,后背包含url的完整版本。location对象的toString()方法返回href属性的值,所以在会隐式调用toString的状况下,可使用location代替location.href.ui
这个对象的其余属性--protocol,host,hostname,port,pathname和search,分别表示URL的各个部分。它们称为“URL分解”属性,同时被Link对象(经过HTML文档中的《a》和《area》元素建立)支持。
location对象的hash和search属性比较有趣。若是有的话,hash属性返回URL中的“片断标识符”部分,search属性也相似,它返回的是问号以后的url,这部分一般是某种类型的查询字符型。通常来讲,这部份内容是用来参数化URL并在其中嵌入参数的
function urlArgs(){ var args={}; var query=window.location.search.substring(1); var pairs=query.split("&"); for(var i=0;i<pairs.length;i++){ var pos=pairs[i].indexOf("="); if(pos==-1)continue; var name=pairs[i].substring(0,pos); var value=pairs[i].substring(pos+1); value=decodeURIComponent(value); arg[name]=value; } return args; }
location对象的assign方法可使窗口载入并显示你指定的url中的文档。repalce方法也相似,但他在载入新文档以前会从浏览历史中把当前文档删除。若是脚本无条件的载入一个新文档,replace方法可能比assgin方法更好的 选择。不然,后退按钮会把浏览器带回到原始文档,而相同的脚本则会再次载入新文档。相对url是相对于当前页面所在的目录来解析的
除了assgin和replace方法,location对象还定义了reload方法,后者可让浏览器从新载入当前文档。
使浏览器跳转到新页面的一种更传统的方法是直接把新的URL赋值给location属性。
location=“http://www.orerlly.com”;
还能够把相对url赋值个location,它们会相对当前url进行解析
location=“page2.html”;
纯粹的片断标识符是相对url的一种类型,它不会让浏览器载入新文档,但只会是它滚动到文档的某个位置。#top标识符是个特殊的例子:若是文档中没有元素的ID是top,它会让浏览器跳到文档开始处
location=“#top”;
location对象的url分解属性是可写的,对它们从新赋值会改变url的位置,而且致使浏览器载入一个新的文档(若是改变的是hash属性,则在当前文档中进行跳转)
location。search=“?page=”+(pagenum+1);
浏览历史
window对象的history属性引用的是该窗口的History对象。history对象是用来把窗口的浏览历史用文档和文档状态列表的形式表示。history对象的length属性表示浏览历史列表中的元素数量
history对象的back和forward方法与浏览器的后退和前进按钮同样:它们使浏览器在浏览历史中先后跳转一格。第三个方法-go接受一个整数参数,能够在历史列表中向前(正参数)或向后(负参数)跳过任意多个页
若是窗口包含多个子窗口,子窗口的浏览历史会按时间顺序穿插在主窗口的历史中。这意味着主窗口调用history.back可能会致使其中一个子窗口往回跳转到前一个显示的文档,但主窗口保留当前状态不变
浏览器和屏幕信息
脚步有时候须要获取和它们所在的web浏览器或浏览器所在桌面相关的信息
本节介绍window对象的navigator和screen属性,它们分别引用的是Navigator和Screen对象
window对象的navigator属性引用的是包含浏览器厂商和版本对象
var s=navigator.userAgent.toLowerCase();
var browser=(function(){ var s=navigator.userAgent.toLowCase(); var match=/(webkit)[\/]([\w.]+)/.exec(s)||/(opera)(?:.*version)?[\/]([\w.]+)/.exec(s)||/(msie)([\w.]+)/.exec(s)||/compatible/.test(s)&&/(mozilla)(?:.*?rv:([\w.]+))?/.exec(s)||[]; return { name:match[1]||"",version:match[2]||0 }; }());
window对象的screen属性引用的是Screen对象。它提供有关窗口显示的大小和可用的颜色数量的信息。属性width和height指定的是以像素为单位的窗口大小。属性availWidth和availHeight指定的是ishijie能够的显示大小。
它们排除了像桌面任务栏这样的特性所占用的空间,属性colorDepth指定的是显示的BPP,典型的值是16 24 32
showModalDialog()在浏览器当前窗口中显示一个模态窗口。第一个参数用以指定提供对话框html内容的url,第二个参数是一个任意值(数组和对象都可),这个值在对话框里的脚本中能够经过window.dailogArguments属性的值访问。第三个参数是一个非标准的列表,包含以分号隔开的name=value对,若是提供了这个参数,能够配置对话框的尺寸和其余属性,用dialogwidth和dialogheight来设置对话框窗口的大小。用resizable=yes来容许用户改变窗口大小
window对象的onerror属性是一个事件处理程序,当未捕获的异常传播到调用践上时就会调用它,并把错误消息输出到浏览器的javascipt控制台上。若是给这个属性赋值一个函数,那么只要这个窗口发生了javascipt错误,就会调用该函数,即它成了窗口的错误处理程序
window对象的onerror事件处理函数的调用经过三个字符串参数,而不是经过一般传递的一个事件对象
第一个参数是描述错误的一条消息,第二个参数是一个字符串,它存放引起错误的javascript代码所在的文档的url,第三个参数是文档中发生错误的行数
除了这三个参数以外,onerror处理程序的返回值也很重要。若是onerror处理程序返回false,它通知浏览器事件处理程序已经处理了错误,不须要其余操做。换句话说,浏览器不该该显示它本身的错误信息。遗憾的是,因为历史缘由,firefox里的错误处理程序必须返回true来表示他已经处理了错误
若是在html文档中使用id属性来为元素命名,而且若是window对象没有此名字的属性,window对象会赋予一个属性,它的名字是id属性的值,它们的值只想表示文档元素的HTMLElement对象。可是有一个重要的警告:若是window对象已经具备此名字的属性,这就不会发生。好比id是history location navigator,就不会以全局变量的形式出现,由于这些id已经被占用了。一样,若是html文档包含一个id为x的元素,而且还在代码中声明并赋值给全局变量x,那么显示声明的变量会隐藏隐式的元素变量。若是脚本中的变量声明出如今命名元素以前,那这个变量的存在就会阻止元素获取它的window属性。而若是脚本中的变量声明出如今命名元素以后,那么变量的显式赋值会覆盖该属性的隐式值
var $=function(id){ return document.getElementById(id); }; var test=$("test");
不少客户端类库都定义了$函数,相似上面同样来经过ID查找元素。(jquery的$函数做为通用的元素选择方法,基于id,标签名,class属性或者其余标准,返回一个或者多个元素)
假设id并无被window对象使用的话,那么任何有id属性的html元素都会成为全局变量的值,id元素在文档中必须是惟一的;两个元素不能有相同的id,可是这对name属性无效。
若是上面的元素有多于一个有相同的name属性(或者一个元素有name属性,而另外一元素有相同值得id属性),那么具备该名称的隐世全局变量会引用一个类数组对象,这个类数组对象的元素是全部命名的元素
有name或id属性的《iframe》元素是个特殊的例子。为它们隐世建立的变量不会引用表示元素自身的Element对象,而是引用表示《iframe》元素建立的嵌套浏览器窗体的window对象
使用window对象的open()方法能够打开一个新的浏览器窗口,window。open载入指定的url到新的或已存在的窗口中,并返回表明那个窗口的window对象。它有4个可选的参数。
open的第一个参数是要在新窗口中显示的文档的url。若是这个参数省略了(也能够是空字符串),那么会使用空页面的url about:blank
open的第二个参数是新打开的窗口的名字,若是指定的是一个已经存在的窗口的名字(而且脚本容许跳转到那个窗口),会直接使用已存在的窗口。不然,会打开新的窗口,并将这个指定的名字赋值给它,若是省略此参数,会使用指定的名字“_blank”打开一个新的、未命名的窗口。
open的第三个可选参数是一个以逗号分隔的列表,包含大小和各类属性,用以代表新窗口是如何打开的,若是省略这个参数,那么新窗口就会用一个默认的大小,并且带有一整组标准的ui组建,即菜单栏,状态栏,工具栏等,另外一方面,若是指定这个参数,就能够指定窗口的尺寸,以及它包含的一组属性
open的返回值是表明命名或者新建立的窗口的window对象。能够在本身的Javascript代码中使用这个window对象来引用新建立的窗口,就像使用隐式的window对象window来引用运行代码的窗口同样。
var w=window.open();
w.alert();
w.location="";
在由window。open方法建立的窗口中,opner属性引用的是打开它的脚本的window对象。在其余窗口中,opener为null
w.open().opener===w;