jQuery解析与处理服务器端返回xml格式数据的方法详解


Posted in Javascript onJuly 04, 2016

本文实例讲述了jQuery解析与处理服务器端返回xml格式数据的方法。分享给大家供大家参考,具体如下:

1.php代码:

<?php
  header("Content-Type:text/xml; charset=utf-8");//声明浏览器端返回数据的格式为xml文档格式
  echo "<?xml version='1.0' encoding='utf-8'?>".
     "<comments>".
     "<comment username='{$_REQUEST['username'] }' >".
     "<content>{$_REQUEST['content']}</content>".
     "</comment>".
     "</comments>";
?>

2.html代码:

<form id="form1" action="#">
  <p>评论:</p>
  <p>姓名: <input type="text" name="username" id="username" /></p>
  <p>内容: <textarea name="content" id="content" rows="2" cols="20"></textarea></p>
  <p><input type="button" id="send" value="提交"/></p>
</form>
<div class='comment'>已有评论:</div>
<div id="resText" ></div>

3.jQuery代码:

<script src="jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
/*
1.由于服务器端返回的数据格式是xml文档,因此需要对返回的数据进行处理,jquery处理xml文档与处理html文档一样,也可以使用常规的attr()、find()、filter()以及其它方法
2.返回数据格式为xml文档的过程实现起来比html片段要稍微复杂点,但xml文档的可移植性是其他数据格式无法比拟的,因此以这种格式提供的数据的重用性将极大提高
3.很多知名网站和开放平台都是以xml格式输出数据,合作者可利用他们提供的API,将获得的内容整合到自己的网站中
4.xml文档体积相对较大,与其它文件格式相比,解析和操作他们的速度要慢一些
5.由于期待服务器端返回的数据格式是xml文档,因此需要在服务器端设置content-type类型,如:
header("content-type:text/xml;charset=utf-8");
*/
$(function(){
  $("#send").click(function(){
   $.get("get2.php", {
      username : $("#username").val() ,
      content : $("#content").val()
     }, function (data, textStatus){
      //data:xml格式的数据;从data【xml格式数据】中查找comment元素username属性的值
      var username = $(data).find("comment").attr("username");//跟解析html文档类似
      var content = $(data).find("comment content").text();
      var txtHtml = "<div class='comment'><h6>"+username+":</h6><p class='para'>"+content+"</p></div>";
      $("#resText").html(txtHtml); // 把返回的数据添加到页面上
     });
  })
})
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
jquery对ajax的支持介绍
Dec 10 Javascript
javascript下拉列表中显示树形菜单的实现方法
Nov 17 Javascript
JavaScript优化专题之Loading and Execution加载和运行
Jan 20 Javascript
js 自带的 map() 方法全面了解
Aug 16 Javascript
纯JavaScript手写图片轮播代码
Oct 20 Javascript
原生js实现电商侧边导航效果
Jan 19 Javascript
详解Vue.js入门环境搭建
Mar 17 Javascript
ES6新特性七:数组的扩充详解
Apr 21 Javascript
微信小程序 动态传参实例详解
Apr 27 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
Nov 15 Javascript
vue项目前端埋点的实现
Mar 06 Javascript
解决Echarts2竖直datazoom滑动后显示数据不全的问题
Jul 20 Javascript
jQuery ajaxSubmit 实现ajax提交表单局部刷新
Jul 04 #Javascript
jQuery通用的全局遍历方法$.each()用法实例
Jul 04 #Javascript
JS构造函数与原型prototype的区别介绍
Jul 04 #Javascript
js中使用使用原型(prototype)定义方法的好处详解
Jul 04 #Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 #Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 #Javascript
全面了解js中的script标签
Jul 04 #Javascript
You might like
PHP脚本数据库功能详解(下)
2006/10/09 PHP
用Json实现PHP与JavaScript间数据交换的方法详解
2013/06/20 PHP
WordPress中给文章添加自定义字段及后台编辑功能区域
2015/12/19 PHP
laravel实现于语言包的完美切换方法
2019/09/29 PHP
PHP简单实现图片格式转换(jpg转png,gif转png等)
2019/10/30 PHP
JavaScript与DOM组合动态创建表格实例
2012/12/23 Javascript
JQuery筛选器全系列介绍
2013/08/27 Javascript
15款jQuery分布引导插件分享
2015/02/04 Javascript
jQuery中prepend()方法使用详解
2015/08/11 Javascript
WordPress中利用AJAX技术进行评论提交的实现示例
2016/01/12 Javascript
JavaScript+html5 canvas绘制渐变区域完整实例
2016/01/26 Javascript
Bootstrap实现带动画过渡的弹出框
2016/08/09 Javascript
JavaScript中push(),join() 函数 实例详解
2016/09/06 Javascript
JS正则获取HTML元素的方法
2017/03/31 Javascript
Taro集成Redux快速上手的方法示例
2018/06/21 Javascript
在axios中使用params传参的时候传入数组的方法
2018/09/25 Javascript
Python基于checksum计算文件是否相同的方法
2015/07/09 Python
Python字符串转换成浮点数函数分享
2015/07/24 Python
华为2019校招笔试题之处理字符串(python版)
2019/06/25 Python
对Django url的几种使用方式详解
2019/08/06 Python
Python中import导入不同目录的模块方法详解
2020/02/18 Python
Pycharm导入anaconda环境的教程图解
2020/07/31 Python
浅谈python锁与死锁问题
2020/08/14 Python
详解anaconda离线安装pytorchGPU版
2020/09/08 Python
基于django和dropzone.js实现上传文件
2020/11/24 Python
python中翻译功能translate模块实现方法
2020/12/17 Python
关于Python错误重试方法总结
2021/01/03 Python
Clarria化妆品官方网站:购买天然和有机化妆品系列
2018/04/08 全球购物
美国花园雕像和家居装饰网上商店:Design Toscano
2019/03/09 全球购物
社会实践心得体会
2014/01/03 职场文书
岗位聘任书范文
2014/03/29 职场文书
九九重阳节标语
2014/10/07 职场文书
2016年校园植树节广播稿
2015/12/17 职场文书
廉洁自律准则学习心得体会
2016/01/13 职场文书
Python Matplotlib绘制条形图的全过程
2021/10/24 Python
Nginx隐藏式跳转(浏览器URL跳转后保持不变)
2022/04/07 Servers