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 相关文章推荐
js 鼠标点击事件及其它捕获
Jun 04 Javascript
javascript中运用闭包和自执行函数解决大量的全局变量问题
Dec 30 Javascript
node.js中的favicon.ico请求问题处理
Dec 15 Javascript
PHP中CURL的几个经典应用实例
Jan 23 Javascript
jquery 将当前时间转换成yyyymmdd格式的实现方法
Jun 01 Javascript
JavaScript导航脚本判断当前导航
Jul 12 Javascript
JS实现队列的先进先出功能示例
May 10 Javascript
一次围绕setTimeout的前端面试经验分享
Jun 15 Javascript
mpvue微信小程序多列选择器用法之省份城市选择的实现
Mar 07 Javascript
webpack-mvc 传统多页面组件化开发详解
May 07 Javascript
JavaScript函数式编程(Functional Programming)声明式与命令式实例分析
May 21 Javascript
在node环境下parse Smarty模板的使用示例代码
Nov 15 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
中国第一家无线电行
2021/03/01 无线电
php获取指定范围内最接近数的方法
2015/06/02 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
jQuery学习4 浏览器的事件模型
2010/02/07 Javascript
jquery form表单序列化为对象的示例代码
2014/03/05 Javascript
jQuery动态修改超链接地址的方法
2015/02/13 Javascript
简介JavaScript中的setHours()方法的使用
2015/06/11 Javascript
JAVA四种基本排序方法实例总结
2015/07/24 Javascript
jQuery Validation PlugIn的使用方法详解
2015/12/18 Javascript
Javascript 数组去重的方法(四种)详解及实例代码
2016/11/24 Javascript
jquery对所有input type=text的控件赋值实现方法
2016/12/02 Javascript
JS+HTML实现的圆形可点击区域示例【3种方法】
2018/08/01 Javascript
详解react-refetch的使用小例子
2019/02/15 Javascript
Js跳出两级循环方法代码实例
2020/09/22 Javascript
JavaScript代码实现微博批量取消关注功能
2021/02/05 Javascript
[08:08]2014DOTA2国际邀请赛中国区预选赛精彩TOPPLAY
2014/06/25 DOTA
Python实现二叉堆
2016/02/03 Python
Python实现统计给定字符串中重复模式最高子串功能示例
2018/05/16 Python
详解Python中的四种队列
2018/05/21 Python
Django实现登录随机验证码的示例代码
2018/06/20 Python
python二维键值数组生成转json的例子
2019/12/06 Python
python3 deque 双向队列创建与使用方法分析
2020/03/24 Python
Django media static外部访问Django中的图片设置教程
2020/04/07 Python
Python将二维列表list的数据输出(TXT,Excel)
2020/04/23 Python
python实现跨年表白神器--你值得拥有
2021/01/04 Python
移动端html5模拟长按事件的实现方法
2018/09/30 HTML / CSS
菲律宾旅游网站:Expedia菲律宾
2017/10/11 全球购物
加大码胸罩、内裤和服装:Just My Size
2019/03/21 全球购物
印度排名第一的蛋糕、鲜花和礼品送货:Winni
2019/08/02 全球购物
英国No.1体育用品零售商:SportsDirect.com
2019/10/16 全球购物
J2EE模式面试题
2016/10/11 面试题
个人简历自我鉴定
2013/10/11 职场文书
庆七一宣传标语
2014/10/08 职场文书
英文投诉信格式
2015/07/03 职场文书
2015年卫生院健康教育工作总结
2015/07/24 职场文书
Html5新增了哪些功能
2021/04/16 HTML / CSS