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

所属分类: 网络编程 / JavaScript 阅读数: 1090
收藏 0 赞 0 分享
开始的代码如下:
复制代码 代码如下:

$.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 this关键字指向常用情况解析

这篇文章主要介绍了JavaScript this关键字指向常用情况解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

Vue-cli打包后如何本地查看的操作

这篇文章主要介绍了Vue-cli打包后如何本地查看的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue cli 3.0通用打包配置代码,不分一二级目录

这篇文章主要介绍了vue cli 3.0通用打包配置代码,不分一二级目录,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JavaScript事件循环及宏任务微任务原理解析

这篇文章主要介绍了JavaScript事件循环及宏任务微任务原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

关于vue-cli3打包代码后白屏的解决方案

这篇文章主要介绍了关于vue-cli3打包代码后白屏的解决方案,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue打包静态资源后显示空白及static文件路径报错的解决

这篇文章主要介绍了vue打包静态资源后显示空白及static文件路径报错的解决,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue-cli3访问public文件夹静态资源报错的解决方式

这篇文章主要介绍了vue-cli3访问public文件夹静态资源报错的解决方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JS继承实现方法及优缺点详解

这篇文章主要介绍了JS继承实现方法及优缺点详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

vue或react项目生产环境去掉console.log的操作

这篇文章主要介绍了vue或react项目生产环境去掉console.log的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题

这篇文章主要介绍了解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享
查看更多