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 相关文章推荐
js新闻滚动 js如何实现新闻滚动效果
Jan 07 Javascript
javascript字符串替换及字符串分割示例代码
Dec 12 Javascript
JS方法调用括号的问题探讨
Jan 24 Javascript
JavaScript DOM事件(笔记)
Apr 08 Javascript
jquery SweetAlert插件实现响应式提示框
Aug 18 Javascript
JavaScript中的原始值和复杂值
Jan 07 Javascript
jquery form表单获取内容以及绑定数据
Feb 24 Javascript
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
Sep 01 Javascript
vue3.0 CLI - 2.5 - 了解组件的三维
Sep 14 Javascript
ES6 新增的创建数组的方法(小结)
Aug 01 Javascript
小程序中的箭头函数的具体使用
Jun 19 Javascript
openlayers实现地图弹窗
Sep 25 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 禁止页面缓存输出
2009/01/07 PHP
PHP图像处理类库及演示分享
2015/05/17 PHP
PHP正则替换函数preg_replace()报错:Notice Use of undefined constant的解决方法分析
2017/02/04 PHP
php+redis实现商城秒杀功能
2020/11/19 PHP
如何在Laravel5.8中正确地应用Repository设计模式
2019/11/26 PHP
图片按比例缩放函数
2006/06/26 Javascript
Visual Studio中的jQuery智能提示设置方法
2010/03/27 Javascript
web页面数据展示新想法(json)
2010/06/08 Javascript
jQuery动画与特效详解
2015/02/01 Javascript
java必学必会之static关键字
2015/12/03 Javascript
PHP7新特性简述
2017/06/11 Javascript
元素全屏的设置与监听实例
2017/11/28 Javascript
vue-cli中的babel配置文件.babelrc实例详解
2018/02/22 Javascript
Vue2.0实现组件之间数据交互和通信操作示例
2019/05/16 Javascript
Vue中使用matomo进行访问流量统计的实现
2019/11/05 Javascript
vue.js的状态管理vuex中store的使用详解
2019/11/08 Javascript
Python中用Ctrl+C终止多线程程序的问题解决
2013/03/30 Python
Python采用socket模拟TCP通讯的实现方法
2014/11/19 Python
判断python字典中key是否存在的两种方法
2018/08/10 Python
Python3.5 + sklearn利用SVM自动识别字母验证码方法示例
2019/05/10 Python
PIL对上传到Django的图片进行处理并保存的实例
2019/08/07 Python
解决Djang2.0.1中的reverse导入失败的问题
2019/08/16 Python
python BlockingScheduler定时任务及其他方式的实现
2019/09/19 Python
Python的赋值、深拷贝与浅拷贝的区别详解
2020/02/12 Python
CSS3 优势以及网页设计师如何使用CSS3技术
2009/07/29 HTML / CSS
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
德国最新街头服饰网上商店:BODYCHECK
2019/09/15 全球购物
香港士多网上超级市场:Ztore
2021/01/09 全球购物
个人简历自我评价八例
2013/10/31 职场文书
中文专业毕业生自荐书范文
2014/01/04 职场文书
大学生毕业鉴定
2014/01/31 职场文书
大学生学期自我鉴定
2014/03/19 职场文书
小学生2014国庆节演讲稿:祖国在我心中
2014/09/21 职场文书
儿园租房协议书范本
2014/12/02 职场文书
JS监听Esc 键触发事键
2021/04/14 Javascript
Matplotlib绘制混淆矩阵的实现
2021/05/27 Python