企业建站系统价格,公司网站建设策划,爱站网关键词密度查询,做网站常用的技术有哪些1、AJAX [1] AJAX简介 全称#xff1a; Asynchronous JavaScript And XML 异步的JavaScript和XML AJAX就是通过JavaScript向服务器发送请求#xff0c;并接收响应#xff0c;然后我们在通过DOM来修改页面。 XML指的是服务器响应的…1、AJAX [1] AJAX简介 全称 Asynchronous JavaScript And XML 异步的JavaScript和XML AJAX就是通过JavaScript向服务器发送请求并接收响应然后我们在通过DOM来修改页面。 XML指的是服务器响应的数据的格式。 目前AJAX已经很少使用XML作为响应的格式。因为XML的解析性能及传输性能较差。 [2] 同步和异步 同步 当我们通过浏览器向服务器发送一个请求时浏览器会刷新整个页面。 异步 当我们向服务器发送请求时不是刷新整个网页而是只刷新网页的一部分。 [3] XMLHttpRequest对象 我们AJAX的所有操作都是围绕着XMLHttpRequest对象进行。 在XMLHttpRequest对象中封装发送给服务器请求报文同时在服务器发回响应时响应信息也会在对象中封装。 如何获取XMLHttpRequest对象 - var xhr new XMLHttpRequest(); [4] 使用步骤 1.创建XMLHttpRequest对象 大部分比较新的浏览器都支持的方式IE7以上 var xhr new XMLHttpRequest(); IE6以下的 var xhr new ActiveXObject(Msxml2.XMLHTTP); IE5.5以下的 var xhr new ActiveXObject(Microsoft.XMLHTTP); 通用的获取XMLHttpRequest对象的方法 //写一个获取XHR的方法function getXMLHttpRequest(){try{//大部分浏览器都支持的方式return new XMLHttpRequest();}catch(e){try{//IE6以下浏览器支持的方式return new ActiveXObject(Msxml2.XMLHTTP);}catch(e){try{//IE5以下的浏览器return new ActiveXObject(Microsoft.XMLHTTP);}catch(e){alert(你是火星来的吧你的浏览器不支持AJAX);}}}}2.设置请求信息请求地址请求方式请求参数 xhr.open(请求方式,请求地址); 在发送post请求时还需要设置一个请求头如下 xhr.setRequestHeader(Content-Type, application/x-www-form-urlencoded); 3.发送请求 xhr.send(请求体); get请求没有请求体所以send中可以传null或什么都不传。 post请求需要通过send来设置请求参数。 4.接收响应信息 //xhr绑定一个onreadystatechange响应函数这个函数会在readyState属性发生改变时调用xhr.onreadystatechange function(){//判断当前readyState是否为4 且响应状态码为200if(xhr.readyState4 xhr.status200){//读取响应信息做相关操作。//如果信息为纯文本xhr.responseText//如果信息为XMLxhr.responseXML}};readyState属性存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成且响应已就绪 status--------- 200: OK 404: 未找到页面 [5] 响应数据的格式 - 响应一个XML - 当我们想通过servlet给ajax返回一个比较大量的信息返回一个对象。 - 返回 User usernamesunwukong age18 gender男 username:sunwukgon,age:18,gender:男 - 我们可以通过一个XML格式来返回一个大量的信息 user name/name age/age gender/gender /user - 响应一个JSON对象
2、JSON [1] JSON简介 JSON全称 JavaScript Object Notation 类似于JS中对象的创建的方法 JSON和XML一样都是一种表示数据的格式 但是JSON比XML的存储和解析性能要高的多JSON要比XML高个30%左右。 user namesunwukong/name age18/age gender男/gender /user {name:孙悟空,age:8,gender:男} [2] JSON的格式 JSON字符串不方便阅读但是传输性能好 XML方便阅读但是传输性能差 JSON的格式和JS对象类型但是要求属性名必须使用双引号。 JSON对象中实际就是一组一组的键值对的结构 键和值使用“”连接多个键值对之间使用“”分开注意如果是最后一组键值对则千万不要在加“” { 属性名1:属性值1, 属性名2:属性值2, 属性名3:属性值3, 属性名4:属性值4 } JSON运行属性值的类型 1.字符串 2.数字 3.布尔 4.对象{} 5.数组[] 6.null 数组 [属性1,属性2,属性3,属性4] [3] JS中使用JSON 对象 -- JSON字符串 JSON.stringify(对象) JSON -- 对象 JSON.parse(JSON字符串) /* 区分js对象和json对象 js对象的属性名不需要使用双引号引起来 json对象的属性名必须使用双引号引起来 //区分json对象和字符串 json对象对象外边使用单引号()括起来就是字符串对象 json对象和字符串对象之间的转换 字符串---json对象[JSON.parse(str)] json对象--字符串[JSON.stringify(obj)] */ [4] Java中使用JSON 目前Java中用的比较多的JSON解析工具 json-lib -- 使用麻烦解析性能最差 Jackson -- 使用较麻烦解析性能最好 Gson -- 使用简单解析性能中能 - Gson是谷歌出的一款JSON解析工具使用简单且性能较好。 Java对象 -- JSON字符串 JSON -- Java对象
3、通过jQuery实现AJAX 使用get和getJSON都会有缓存问题并且使用get方法不能传送较多的数据。 post方法不会有缓存的问题所以我们开发时使用post方法较多。 [1] post()方法 $.post(url, [data], [callback], [type]) 参数 url发送AJAX的请求地址字符串。 data发送给服务器的请求参数JSON格式。 callback当前需要获取服务器发送的响应时我们可以通过该回调函数。 jQuery会将响应信息以回调函数的参数的形式返回 type响应信息的类型字符串。一般两个常用值text、json [2] get()方法 - get方法和post方法使用方式基本一致。 [3] getJSON()方法 getJSON(url, [data], [callback]) getJSON方法和get方法类似只不过该方法默认的响应类型为JSON不需要再手动指定。
更多专业前端知识请上
【猿2048】www.mk2048.com
