DOM 简介
DOM=Document Object Model (文档对象模型)定义了对象的类型和属性,从而允许浏览器表示标记
DOM 是这样规定的:
整个文档是一个文档节点
每个 HTML 标签是一个元素节点
包含在 HTML 元素中的文本是文本节点
每一个 HTML 属性是一个属性节点
注释属于注释节点
节点:我们知道标记的每一个部分都由一个对象表示,但它不只是一个任意的对象,它是特定类型对象,一个DOM节点,比如:文本,元素和属性,都继承自这个基本节点类型。
例如:var number = document.getElementById("phone").value
DOM树中的每一个元素和每段文本都有一个父亲,这个父节点可能是另外一个元素的孩子,或者DOM树中的顶层元素。
结点的属性:
nodeName:结点的名称
nodeValue:节点的值
parentNode:返回父结点
childNodes:孩子节点
firstChild:仅仅是childnodes列表中的最后一个节点
lastChild:与上面相似
previousSibling:返回当前节点之前的节点(同一个父节点)
nextSibling:返回下一个节点(同一个父节点)
attributes:仅用于元素节点,返回元素的属性列表
DOM对文档操作
通过DOM不但可以遍历XML文档指定的节点,如Element节点、文本节点和属性节点等,还可以对在内存中存在的树模型进行操作,如添加、删除或修改节点,添加、删除或修改属性,添加元素内容等。
动态创建XML文档
DOM解析器通过在内存中建立和XML结构相对应的树状结构数据,使得应用程序可以方便地获得XML文件中的数据。JAXP也提供了使用内存中的树状结构数据建立一个XML文件的API,即使用解析器得到的Document对象建立一个新的XML文件。
名称 |
说明 |
appendChild(Node newChild) |
向当前节点增加一个新的子节点,并返回这个新节点 |
removeChild(Node oldChild) |
删除参数指定的子节点,并返回被删除的子节点 |
replaceChild(Node newChild, Node oldChild) |
替换子节点,并返回被替换的子节点 |
removeAttributeNode(Attr oldAttr) |
删除Element节点的属性 |
setAttribute(String name, String value) |
为Element节点增加新的属性及属性值,如果该属性已经存在,新的属性将替换旧的属性。 |
replaceWholeText(String content) |
替换当前Text节点的文本内容 |
appendData(String arg) |
向当前Text节点尾加文本内容 |
insertData(int offset, String arg) |
向当前Text节点插入文本内容,插入的位置由参数offset指定,即第offset个字符的后继位置 |
deleteData(int offset,int count) |
删除当前节点的文本内容中的一部分。被删除的范围由参数offset和count指定,即从第offset个字符后续的count个字符 |
replaceData(int offset,int count, String arg) |
当前Text节点中文本内容的一部分替换为参数arg指定的内容,被替换的范围由参数offset和count指定,即从第offset个字符后续的count个字符 |
JSON简介
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式。同时,JSON是JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不需要任何特殊的 API 或工具包。
本文主要是对JS操作JSON的方法做下总结。
创建json:
var str1={"xlid":"cxh","xldigitid":123456,"topscore":2000,"topplaytime":"2009-08-20"};
一、JSON字符串转换为JSON对象
要使用上面的str1,必须使用下面的方法先转化为JSON对象:
//由JSON字符串转换为JSON对象
var obj = eval('(' + str + ')');
或者
var obj = str.parseJSON(); //由JSON字符串转换为JSON对象
或者
var obj = JSON.parse(str); //由JSON字符串转换为JSON对象
然后,就可以这样读取:
Alert(obj.name);
Alert(obj.sex);
二、可以使用toJSONString()或者全局方法JSON.stringify()将JSON对象转化为JSON字符串。
例如:
var last=obj.toJSONString(); //将JSON对象转化为JSON字符
或者
var last=JSON.stringify(obj); //将JSON对象转化为JSON字符
alert(last);
JSON与XML的比较:
(1).可读性方面。
JSON和XML的数据可读性基本相同,JSON和XML的可读性可谓不相上下,一边是建议的语法,一边是规范的标签形式,XML可读性较好些。
(2).可扩展性方面。
XML天生有很好的扩展性,JSON当然也有,没有什么是XML能扩展,JSON不能的。
(3).编码难度方面。
XML有丰富的编码工具,比如Dom4j、JDom等,JSON也有json.org提供的工具,但是JSON的编码明显比XML容易许多,即使不借助工具也能写出JSON的代码,可是要写好XML就不太容易了。
(4).解码难度方面。
XML的解析得考虑子节点父节点,让人头昏眼花,而JSON的解析难度几乎为0。这一点XML输的真是没话说。
(5).流行度方面。
XML已经被业界广泛的使用,而JSON才刚刚开始,但是在Ajax这个特定的领域,未来的发展一定是XML让位于JSON。到时Ajax应该变成Ajaj(Asynchronous Javascript and JSON)了。
(6).解析手段方面。
JSON和XML同样拥有丰富的解析手段。
(7).数据体积方面。
JSON相对于XML来讲,数据的体积小,传递的速度更快些。
(8).数据交互方面。
JSON与JavaScript的交互更加方便,更容易解析处理,更好的数据交互。
(9).数据描述方面。
JSON对数据的描述性比XML较差。
(10).传输速度方面。
JSON的速度要远远快于XML