前端进阶DOM

window object

• document 对象
• frames 对象
• history 对象
• location 对象
• navigator 对象
• screen 对象

 

一般所说的DOM是指XML DOM，而W3C也为HTML页面提供了更快捷的DOM——HTML DOM!
使用HTML DOM，能使访问HTML标签的属性就像访问JavaScript创建的对象的属性一样简单

var bodyTag = document.documentElement.lastChild;//DOM标准方式
    bodyTag = document.body;//HTML DOM方式
    var titleTag = document.getElementsByTagName("title")[0].firstChild.nodeValue;//DOM标准方式
    titleTag = document.title;//HTML DOM方式
    //HTML DOM不仅仅可以用来获取内容，也可以设置
    document.title ="Change The Title!!!";

目前浏览器四大主流内核

1. Trident

   Trident （又称为MSHTML），是微软的窗口操作系统（Windows）搭载的网页浏览器—Internet Explorer的排版引擎的名称，它的第一个版本随着1997年10月Internet Explorer第四版释出，之后不断的加入新的技术并随着新版本的Internet Explorer释出。在未来最新的Internet Explorer第七版中，微软将对Trident排版引擎做了的重大的变动，除了加入新的技术之外，并增加对网页标准的支持。尽管这些变动已经在相当大 的程度上落后了其它的排版引擎。使用该引擎的主要浏览器：IE，TheWorld，MiniIE，Maxthon，腾讯TT浏览器。事实上，这些浏览器是 直接使用了IE核心，因为其userAgent字符串中返回的信息与IE是一模一样的！

2. Gecko

   壁虎，英文为"Gecko"。Gecko是由Mozilla基金会开发的布局引擎的名字。它原本叫作NGLayout。Gecko的作用是读取诸如 HTML、CSS、XUL和JavaScript等的网页内容，并呈现到用户屏幕或打印出来。Gecko已经被许多应用程序所使用，包括若干浏览器，例如 Firefox、Mozilla Suite、Camino,Seamonkey等等

3. Presto

   Presto是一个由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。Presto取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版。Presto在推出后不 断有更新版本推出，使不少错误得以修正，以及阅读Javascript效能得以最佳化，并成为速度最快的引擎。

4. KHTML

   是HTML网页排版引擎之一，由KDE所开发。KDE系统自KDE2版起，在档案及网页浏览器使用了KHTML引擎。该引擎以C++编程语言 所写，并以LGPL授权，支援大多数网页浏览标准。由于微软的Internet Explorer的占有率相当高，不少以FrontPage制作的网页均包含只有IE才能读取的非标准语法，为了使KHTML引擎可呈现的网页达到最多， 部分IE专属的语法也一并支援。目前使用KHTML的浏览器有Safari和Google Chrome。而KHTML也产生了许多衍生品，如：WebKit,WebCore引擎

 

getElementsByName方法始终返回一个集合，不管页面中name是否是唯一的。 IE 6.0和Opera 7.5在这个方法的使用上还存在一些错误。
首先，它们还会返回id等于给定名称的元素。第二，它们仅仅检查<input/>和<img/>元素。

获取和设置元素属性——getAttribute与setAttribute方法
　　var p1 = document.getElementById("p1");
　　alert(p1.getAttribute("id"));
　　p1.setAttribute("title","Value");

常用的节点属性

• nodeType——节点类型，元素节点是1，文本节点是3
• nodeValue——节点值，元素节点为空，文本节点的nodeValue属性即为文本内容
• firstChild——该元素节点包含的第一个子节点
• lastChild——该元素节点包含的最后一个子节点
• nextSibling——该节点的后一个兄弟节点
• previousSibling——该节点的前一个兄弟节点
• childNodes——子节点列表,可以通过node.childNodes[index]（或node.childNodes.item(index)）来获取子节点
• nodeName——节点名称，对于元素节点，返回tagName,对于文本，则返回#tex

　　不同浏览器在判断何为Text节点上存在一些差异。某些浏览器，如Mozilla，认为元素之间的空白(包括换行符)都是Text节点；而另一些浏览器，如IE，会全部忽略这些空白!!