8：BOM（浏览器对象模型）
BOM的核心是window，它是一个浏览器的实例
在浏览器中，window具有双重角色，它既是用过JS访问浏览器的一个接口，又是EMCA规定的Global对象。
定义全局变量和定义在window上的属性还是有区别的；
全局变量是不能直接使用delete删除（通过var创建的属性有个一个ConfigureAble特性，他的默认值是false所以不能直接删除）
定义在window对象上的属性是可以直接用delete删除的。
var num=10;//定义的全局变量的属性window.num2=12;//在window下创建的属性delete num;delete window.num2;console.log(num);console.log(window.num2);结果：
8.1.2窗口关系及框架：
如果页面中包含框架，则每个框架都会保存在frames集合中，可以通过索引值来访问相应的框架Frame（框架）
可以通过页面结构来访问相印的框架
8.1.3窗口位置
确定window的位置属性值得方法是：screenLeft 和screentop 分别指上方的左侧。firefox也支持screenX和screenY属性来提供window对象的位置属性。
使用moveTo（）和moveBy（）方法可以将窗口移动到一个新的位置都接受两个值：
moveTo（）接受的两个值是x和y坐标的值而moveBy（）接收的是水平方向和垂直方向上移动的像素值。
window.moveTo(200,300);window.moveBy(100,200);
8.1.4 窗口大小：
确定一个窗口的大小：提供了四个属性：innerWidth innerHeight outWidth outHeight.在IE9+ safair 和firefox中，outerWidth和outerHeigth返回浏览器窗口本身的尺寸
var height = document.documentElement.clientHeight;document.write(height);var width = document.documentElement.clientWidthdocument.write(" "+width);
获取页面视口的大小
在IE6中，标准模式对着些方法来说才能使用，在混杂模式下只能通过
document.body.clientHeight;document.body.clientLeft;
来获取
对于移动设备，window.innerWidth 和 document.innerHeight 保存着可视视口
通过resizeTo()和resizeBy()方法可以调整浏览器的大小。都接受两个参数
resizeTo()接受浏览器的新宽度和新高度，
resizeBy()接受新窗口和旧窗口的宽度只差和高度只差。
8.1.5导航和打开窗口
window.open();方法可以导航到一个新的窗口
可以接收四个参数：要加载的URL 窗口目标 一个特性字符串以及一个表示新页面是否取代旧页面的boolean值
通常只传递一个参数
第二个参数：窗口目标，如果没有窗口目标就可以使用下列的任意一个数：_self _paretn _top _blank。
第三个参数
弹出窗口屏蔽程序：
var blocked=false;try{var wroxWin=window.open("http://www.wrox.com","_blank"); } catch (ex){blocked=true; }if(blocked){alert("The popup was blocked!"); }
8.1.6间歇调用和超时调用
超时调用：
setTimeout()计时器，在载入后延迟指定时间后,去执行一次表达式,仅执行一次。
语法:
setTimeout(代码,延迟时间);
建议调用方式
setTimeout(function(){alert("Hello World");},3000);
setTimeout()和clearTimeout()一起使用，停止计时器。
语法:
clearTimeout(id_of_setTimeout)
var timer=setTimeout(function(){alert("Hello World");},3000);clearTimeout(timer);
间歇调用：
setInterval(function(){alert("Hello World");},1000);
故名思议就是过一段时间就调用一次
系统对话框：
浏览器有三种形式的对话框
alert（），confirm（），prompt（），
第一种：
alert("are you sure");
在浏览器中的现实效果
第二种：
confirm（）：它返回的是一个boolean值类型，点击确认按钮返回true 点击取消就返回false
if(confirm("are you sure!")){alert("you click sure");}else{alert("you click False");}
第三种：prompt（）方法，
里面包含得了两个参数
prompt（str1,str2）;
str1的值是不能修改的，str2的值是用来提示用户的，可以修改，当你点击确定，返回值是str2的值。如果点击取消返回一个null值。
8.2location对象：提供了当前页面中加载的文档有关信息，还提供了一些导航的功能。
location用于获取或设置窗体的URL，并且可以用于解析URL。
语法:
location.[属性|方法]
location 对象方法
解析当前的URL
var url=document.location.href;
document.write(url);
8.2.2位置操作：
使用location对象可以通过很多方式来改变浏览器的位置，最常用的就是：assign（）方法并为其传递一个URL
assign（）和window.location();达到的效果一样；
我们可以通过调用location.replace（）方法来禁用返回前一页面的功能。
location。reload（true）；//重新加载（从服务器重新加载）
location.replace（）；//重新加载（有可能从服务器中加载）
8.3navigator对象
Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。
判断当前所用的浏览器型号信息
function validB(){
var u_agent =navigator.userAgent;
var B_name="不是想用的主流浏览器!";
if(u_agent.indexOf("Firefox")>-1){
B_name="Firefox";
}else if(u_agent.indexOf("Chrome")>-1){
B_name="Chrome";
}else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){
B_name="IE(8-10)";
}
document.write("浏览器:"+B_name+"<br>");
document.write("u_agent:"+u_agent+"<br>");
}
8.3.1检测插件：
对于非IE浏览器，可以使用plugins数组来达到这个目的。
function hasPlugin(name){ name=name.toLowerCase();//转换小写for(var i=0;i<navigator.plugins.length;i++){if(navigator.plugins[i].name.toLowerCase().indexOf(name)>-1){return true; } }return false;}
这个hasplugin（）接受一个参数：要检测的插件名。
//检测IE中的插件function hasIEPlugin(name){try{new ActiveXObject(name);return true; }catch(ex){return false; }}
8.4 screen对象：
screen对象
screen对象用于获取用户的屏幕信息。
语法：
window.screen.属性
8.5 history对象
保存着用户的上网历史记录。
//前进一页
history.go(1)
//后退一页
history.go(-1)
//前进两页
history.go(2)
back()和forward（）方法用来前进和后退
history.back（）；
history.forwward（）；
第十章：DOM
DOM（文档对象模型）
文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。
将HTML代码分解为DOM节点层次图:
1：nodeName和nodeValue
要了解节点的具体类型，可以使用者两个属性，分别返回的值是，节点的名称和节点的值。
nodeType：节点属性
元素：1
属性：2
文本：3
注释：8
文档：9
2：节点关系：
每个节点都有一个childNodes属性，其中保存着一个NodeList对象。它是一种类数组对象，用于保存一组有序的节点，可以通过位置来访问这些节点。NodeList对象也有length属性，但是他不是Array的实例。
下面的例子展示了如何访问保存在nodeList中的节点——可以通过方括号，可以使用item（）方法。
遍历节点树:
var firstChile=someNode.childNodes()[0];
var secondChild=someNode.childNodes.item(1);
var count=someNode.childNodes.length;
3操作节点：
appendChild（），在childNode列表的末尾添加一个节点。
insertBefore（）接受两个参数，要插入的节点和需要参照的节点。
replaceChild（）接受两个参数，要插入的值和要取代的值。
如果只想删除某个节点的话就可以使用
removechild（）；
这几个方法操作的都是子节点，所以必须先得到父节点（parentNode）。
4：其他方法：
cloneNode（），用于创建调用这个方法的节点的一个完全相同的副本。cloneNode接收一个boolean值类型的参数值
参数是true：执行深复制，复制整个节点和子节点树；
参数是false：执行浅节点，复制完的节点属于文档所有，单并没有给他指定父节点。除非使用上述添加节点的方法将它添加到父节点中。
normalize（）处理文档树中的文本节点；
10.1.2 Document类型
document对象是HTMLDocument的一个实例，表示整个HTML页面。而且document是window对象中的一个属性，因此可以将其作为全局对象来访问。Document节点具有以下特征：
nodetype：9
nodeName："#document";
nodeValue：null
parentNode：null
ownerDocument：null
其子节点可能是一个DocumentType、Element、processingInstruction或Comment；
1:文档的子节点：
访问其子节点的快捷方式：documentElement属性该属性始终指向HTML页面中的<html>元素。
另一个就是通过childNodes列表访问文档元素。但是通过前者更加快捷
var html = document.documentElement;//取得对<html>的引用
作为HTML的实例对象还有一个body属性，直接指向<body>元素
var body=document.body;//取得对<body>的应用
2：文档信息：
设置文档的标题：
document.title="demo";
获取文档的标题
var title=document.title;console.log(title);
三个关于网页请求的属性：
//取得完整的URL
var url =document.URL
//取得域名
var domain=document.domain;
//取得来源页面的URL
var referrer=document.referrer;
在这三个属性中，只有domain是可以设置的。
3：查找元素：
取得元素的操作可以使用document对象的几个方法来完成。其中，Document类型提供了两个方法：
getElementById()和getElementByTagName();
getElementById():通过ID名来获取相应的元素；
getElementByTagName()接受一个参数，就是你要获取的元素的名称
还有一个方法叫做，nameItem（）；可以通过元素的name特性取得集合中的项。
想要获取全部元素可以向getElementByTagName()中添加一个*，
第三个方法用样也是对文档类型对象
getElementByName()；通过name属性来获取元素；
4：特殊集合
除了属性和方法，document对象还有一些特殊的集合。这些集合都是HTMLCollection对象，为访问文档常用的部分提供了快捷方式，包括：
document.anchors:包含文档中所有包含name特性的<a>标签
document.applets:不再使用了，获得所有appletes元素标签
document.forms:获取所有<form>元素
document.images:包含所有文档中的<img>元素
document.links:获取文档中所有带href特性的a标签。
5：DOM一致性
由于DOM分为多个级别，也包含了多个部分，所以就需要来检测
利用document.implementation属性的hasFeature（）方法来进行检测
这个方法接收两个参数，一个是DOM功能的名称和版本号，如果支持就返回true 不支持就返回false
6：文档写入：
重要功能就是将输出流写入到页面中的能力。这个能力体现在以下的四个方法中
write（）和writeln（）：
都接受一个参数，即要写入到页面中的值，write（）会原样写入，writeln（）方法则会在字符串最后加一个换行符
例子：
document.write("<strong>"+new Date().toString()+"</strong>")
open（）和close（）分别用于打开和关闭网页的输出流。如果是在页面加载期间使用write（）或者writeln（）方法则不需要使用这两种方法：
10.1.3Element类型：Element节点具有以下特征
nodetype：1
nodeName：的值为元素的标签名;
nodeValue：null
parentNode：可能是document或者Element
其子节点可能是Element、Text、Comment、ProcessingInstruction、CDATASection或者EntntyReference。
要访问元素的标签名可以使用nodeName或者tagName属性
var element=document.getElementById("myiD");console.log(element.tagName);console.log(element.tagName.toLowerCase()=="div");
1：HTML元素：
id：元素在文档中的唯一标识符
title：有关元素的附加说明，一般通过工具提示条显示出来
lang：元素内容的语言代码，很少使用
dir：语言方向很少使用
className：通过元素的class特性来对应
上述这些属性都可以用来取得或修改相应的特性值。
<div id="myiD" title="123" lang="en" dri="ltr" class="myid">IS a div element</div>
可以先通过document.getElementById("myiD");方法或者其他方法来得到元素，在使用.属性。来获取或者修改元素的特性值
2：取得特性（属性）：
通过getAttribute（）；来获取元素内部的属性；
如：
var element=document.getElementById("myiD");var name=element.getAttribute("title");console.log(name);
3：设置特性：
通过获得元素，然后通过getAttribute()方法来获取内部的属性值、
有获得当然就有修改和删除：
修改：setAttribute();获取两个string类型的参数，一个是你要修改的属性值，一个是替换的值
删除：removeAttribute();彻底删除这个属性。
4：attributes属性
attribute属性是一个DOM节点类型属性。attribute属性中包含一个NameNodeMap，与Nodelist类似，也是是一个动态集合，元素的每一个特性都由一个attr节点表示，
NameNodeMap对象拥有下列方法。
getNamedItem(name):返回nodeName属性等于name的节点
removeNameItem(name)：从列表中移除nodeName属性。
setNameItem(node)：向列表中添加节点
Item(pos);返回数字pos位置处的节点；
attribute具有一系列的节点，nodeName就是元素内属性（特性）的name nodeValue就是该属性（特性）的值；
想获得id元素的特性
5：创建元素：
通过 document.creatElement("element");
接收一个参数，要创建的标签名
6：元素的子节点：
childNodes属性包含了所有子节点的信息
var getElement=document.getElementById("menu");for(var i= 0,len=getElement.childNodes.length;i<len;i++){if(getElement.childNodes[i]==1){//执行操作}}
10.1.4 Text类型：
对纯文本的操作，就是元素标签之间的值；
var one=document.getElementById("newOne");one.innerHTML="thi";
向空标签之间添加内容；
可以通过nodeValue属性或者data属性访问text节点中包含的文本，下列方法可以操作节点中的文本。
appendDate（text）：将text添加到节点的末尾；
deleteDate（offset，count）：从offset指定的位置开始删除count个字符；
insertData（offset，text）：在offset的位置添加text
replaceData（offset，count，text）替换
splitText（offset）分割
substringData（offset，count）：提取
var one=document.getElementById("newOne");var text =document.createTextNode("hello word")one.appendChild(text);
2规范化文本节点：
normalize（）
3：分割文本节点：
splitText（offset）分割 从offset的位置开始分割；
10.1.5 comment类型
获取注释的值；
10.1.6 CDATASection类型
只针对XML文档，表示CDATASction区域
10.1.7 DocumentType类型
主要包含着doctype的相关信息
10.1.8 DocumentFragment类型：
一种轻量级文档，可以包含控制节点，但不会想完整的文档那样去占用内存。
10.1.9 attr类型：
attr就是attribute（）的子节点：操作属性最常用到的就是getAttribute（），setAttribute（），和removeAttribute（），操作属性的。
attr有三个属性：name,value和specified