当前位置: 代码迷 >> Ajax >> 黑马软件工程师_DOM及AJAX基本概念
  详细解决方案

黑马软件工程师_DOM及AJAX基本概念

热度:191   发布时间:2012-08-25 10:06:20.0
黑马程序员__DOM及AJAX基本概念

---------------------- android培训java培训、期待与您交流! ---------------------

 

DOM(document object model)

节点:整个文档就是一个文档节点,而每一个HTML标签就是一个元素节点,标签中的文字则是文本节点,标签的属性是属性节点,一切都是节点;

DOM属性:

nodeName:一个字符串,其内容是给定节点的名字。

var name=node.nodeName;

如果节点是元素节点,nodeName返回这个元素的名称;

如果是属性节点,nodeName返回这个属性的名称;

如果是文本节点,nodeName返回一个内容为#text的字符串;

注:nodeName是一个只读属性;

nodeType:返回一个整数,这个数值代表着给定节点的类型;

nodeType:属性返回的属性值对应着12种节点类型,常用的有3种:

1、  Node.ELEMENT_NODE------1à元素节点

2、  Node.ATTRIBUTE_NODE----2à属性节点

3、  Node.TEXT_NODE-------------3à文本节点

nodeValue:返回给定节点的当前值(字符串)

1、  如果给定节点是一个属性节点,返回值是这个属性的值

2、  如果给定的值是一个文本节点,返回值是这个文本节点的内容

3、  如果给定节点是一个元素节点,返回值是null

nodeValue是一个读/写属性,但不能对元素节点的nodeValue属性设置值,但可以为文本节点的nodeValue属性设置一个值。

       var li=document.getElementById(“li”);

       li.firstChild.nodeValue=”国庆60”;

替换节点:

replaceChild( ):把一个给定父元素里的一个子节点替换为另外一个子节点;

var reference=element.replaceChild(newChild,oldChild);返回值是一个指向已被替换的那个子节点的引用指针;

如果被插入的子节点还有子节点,则那些子节点也被插入到目标节点中;

appendChild()、insertBeforenewTarget,oldTareget);

1、  document.createElement( “li”);

2、  setAttribute(“ ”,” ”);

3、  document.createTextNode(“ ”);

4、  appendChild( );

删除节点:removeChild();

:在逻辑运算中,0、“”、falsenullundefinedNaN均表示false

       Null:对象不存在;

       Undefined:声明的变量没有初始化,或者对象属性、方法不存在;

AJAX

同步交互和异步交互:

普通B/S模式(同步)、AJAX技术(异步)

1、  同步:提交请求à等待服务器处理à处理完毕返回(这个期间客户端浏览器不能干任何事)

2、  异步:请求通过事件触发à服务器处理(这时浏览器可以做其他事情)à处理完毕

同步是指:发送方发出数据后,等待接收方发出响应以后才发下一个数据包的通讯方式;

异步是指:发送方发出数据后,不等接收方发回响应,接着发送下个数据包的通讯方式;

AJAX Asynchronous JavaScript and XML:允许浏览器与服务器通信而无需刷新当前页面的技术;

AJAX的工作原理:AJAX采用异步交互过程,AJAX在用户与服务器之间引入一个中间媒介,从而消除了网络交互过程中的处理----等待----处理-----等待缺点;

用户的浏览器在执行任务时即装载了AJAX引擎,AJAX引擎用JavaScript编写,通常藏在一个隐藏的框架中,他负责编译用户界面与服务器之间的交互;

AJAX建立和服务器的链接,接收服务器的请求,处理服务器返回的数据:

1、  创建XMLHttpRequest对象

2、  打开和服务器的连接(openmethodurlasynch))à请求方式、请求路径、是否异步

3、  发送数据(send())à若get,传null

4、  接收服务端的响应

服务器端的数据必须以浏览器能够理解的格式来发送:XMLJSONHTML

JSON规则:

1、  映射用冒号(“:”)表示,名称:值

2、  并列的数据之间用逗号(“,”)分隔;名称1:值1,名称2:值2

3、  映射的集合(对象)用大括号(“{ }”)表示;{名称1:值1,名称2:值2}

4、  并列数据的集合(数组)用方括号(“[ ]”)表示

[

        {名称1:值1,名称2:值2}

        {名称1:值1,名称2:值2}

]

5、  元素值可具有的类型:stringnumberobjectarraytruefalsenull;

 

 

---------------------- android培训java培训、期待与您交流! ----------------------详细请查看:http://edu.csdn.net/heima 

  相关解决方案