jquery $.ajax()取xml数据的小问题解决方法


Posted in Javascript onNovember 20, 2010

开始的代码如下:

$.ajax({ 
type: "get", 
url: "Database/App_all.xml", 
dataType: "xml", 
timeout: 2000, 
beforeSend: function () {}, 
success: function (xml) { 
$(xml).find("app[id='id-1']").find("auther").appendTo($("#contain")); 
}, 
error: function () { 
alert("ajax failed!"); 
} 
});

也就是,从App_all.xml这个文件中找到id为“id-1”的这一项,并将继续在其子节点中找到auther标签,并将其内容加入到id 为contain
的div中,xml中我要查找的内容为<auther>cocept</auther>,我就是想把cocept这个字段取出来,放入容器中

结果这段代码在firefox中生效,在opera中也生效,但是在Safari和chrome中却没有效果,于是我上jQuery的官方论坛,和StackFlowover
论坛提问,后者有人回复我:

I assure you I was using $.ajax with Chrome just five hours ago at the office, and had no such problem.

I also imagine they use it here on SO and I have no problems here. I have no problems on jQueryUI in Chrome. I think it is your code.
大意就是斩钉截铁的说他用起来没有问题,是我自己的问题,我也纳闷了,后面也有人给我的建议更复杂:

You should use chrome's or safari's built-in developer tools (ctrl+shift+i) to track JS errors and track actual AJAX requests.

Is your code wrapped in document.ready? Is there any erros in javascript console? Also try to output something after success callback line.
Another cause for this could be incorrect mime-type for your XML file returned by server. It should be [Content-type: text/xml].
You can check that in chrome's or safari's built-in developer tools - just look for headers tab when xml resource is selected.
If it 's actual problem, you may need to tweak web-server configuration (main config or .htaccess for apache) to return correct mime-type

毕竟是自学jquery ajax框架刚起步……就遇到这么棘手的问题,的确麻烦……

但是,由于我一个不经意的发现,问题迎刃而解……

我用firebug查看成功后的页面元素状态,发现:

<div id="contain"> 
<auther>cocept</auther> 
</div>

我恍然大悟,原来这种直接用pretendTo插入的方法会连tagname也插入进去,难怪chrome和Safari不能识别(从另一个方面来说Firefox原来强大这么多……)

于是修改后的代码如下:

success: function (xml) { 
$("#contain").html($(xml).find("app[id='id-1']").find("auther").text()); 
}

先取出所需元素的text()的值,再以修改html的方法html()插入容器中,大功告成啦!测试均通过
Javascript 相关文章推荐
javascript 兼容鼠标滚轮事件
Apr 07 Javascript
jquery 事件执行检测代码
Dec 09 Javascript
JavaScript极简入门教程(二):对象和函数
Oct 25 Javascript
jQuery实现的向下图文信息滚动效果
May 03 Javascript
jQuery CSS3自定义美化Checkbox实现代码
May 12 Javascript
详解vue+css3做交互特效的方法
Nov 20 Javascript
Vue cli构建及项目打包以及出现的问题解决
Aug 27 Javascript
vue中组件的3种使用方式详解
Mar 23 Javascript
详解微信小程序开发(项目从零开始)
Jun 06 Javascript
webpack HappyPack实战详解
Oct 08 Javascript
JavaScript Window窗口对象属性和使用方法
Jan 19 Javascript
JS数组去重详情
Nov 07 Javascript
简单实用的js调试logger组件实现代码
Nov 20 #Javascript
扩展javascript的Date方法实现代码(prototype)
Nov 20 #Javascript
javascript AOP 实现ajax回调函数使用比较方便
Nov 20 #Javascript
AJAX异步从优酷专辑中采集所有视频及信息(JavaScript代码)
Nov 20 #Javascript
javascript来定义类的规范小结
Nov 19 #Javascript
Javascript面象对象成员、共享成员变量实验
Nov 19 #Javascript
js 创建快捷方式的代码(fso)
Nov 19 #Javascript
You might like
十大感人催泪爱情动漫 第一名至今不忍在看第二遍
2020/03/04 日漫
用DBSQL类加快开发MySQL数据库程序的速度
2006/10/09 PHP
PHP MYSQL乱码问题,使用SET NAMES utf8校正
2009/11/30 PHP
深入剖析PHP中printf()函数格式化使用
2016/05/23 PHP
php 使用redis锁限制并发访问类示例
2016/11/02 PHP
Thinkphp5+Redis实现商品秒杀代码实例讲解
2020/12/29 PHP
JavaScript 学习笔记(九)call和apply方法
2010/01/11 Javascript
JavaScript prototype对象的属性说明
2010/03/13 Javascript
IE6图片加载的一个BUG解决方法
2010/07/13 Javascript
来自qq的javascript面试题
2010/07/24 Javascript
javascript跑马灯悬停放大效果实现代码
2012/12/12 Javascript
微信小程序开发之大转盘 仿天猫超市抽奖实例
2016/12/08 Javascript
利用js判断手机是否安装某个app的多种方案
2017/02/13 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
2017/03/28 jQuery
webpack配置文件和常用配置项介绍
2017/04/28 Javascript
深入理解Vue生命周期、手动挂载及挂载子组件
2017/09/27 Javascript
简单实现jquery隔行变色
2017/11/09 jQuery
JS表单传值和URL编码转换
2018/03/03 Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
2018/09/15 Javascript
如何解决.vue文件url引用文件的问题
2019/01/18 Javascript
Python中的is和id用法分析
2015/01/26 Python
详解Python之unittest单元测试代码
2018/01/24 Python
python3实现公众号每日定时发送日报和图片
2018/02/24 Python
对numpy.append()里的axis的用法详解
2018/06/28 Python
在Ubuntu中安装并配置Pycharm教程的实现方法
2021/01/06 Python
python中re模块知识点总结
2021/01/17 Python
美国受欢迎的女性牛仔裤品牌:DL1961
2016/11/12 全球购物
Paradox London官方网站:英国新娘鞋婚礼鞋品牌
2019/08/29 全球购物
师范毕业生求职自荐信
2013/09/25 职场文书
部队学习十八大感言
2014/01/11 职场文书
媒矿安全生产承诺书
2014/05/23 职场文书
新兵入伍心得体会
2014/09/04 职场文书
美国旅游签证工作证明
2014/10/14 职场文书
党支部综合考察意见
2015/06/01 职场文书
2015秋季开学演讲稿范文
2015/07/16 职场文书
无故旷工检讨书
2015/08/15 职场文书