如何解析JQUERY 通过AJAX请求来的HTML数据
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何解析JQUERY 通过AJAX请求来的HTML数据相关的知识,希望对你有一定的参考价值。
参考技术A javascript代码:$.ajax(
url:'/htmltest',
type:'get',
dataType:'xml',
timeout:1000,
error:function()
alert("request error!");
,
success:function(da
ta)
alert(da
ta);
$(da
ta).find("div").each(function()
var text = $(this).text();
alert(text);
);
);
Java代码:
protected void doGet(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws ServletException, IOException
httpServletResponse.setContentType("text/xml;charset=utf-8");
httpServletResponse.setHeader("Cache-Control","no-cache");
PrintWriter out = httpServletResponse.getWriter();
out.println("<div>");
out.println("<p>test dom tree</p>");
out.println("</div>");
out.flush();
out.close();
本回答被提问者和网友采纳
带有ajax请求的jQuery .each循环
【中文标题】带有ajax请求的jQuery .each循环【英文标题】:jQuery .each loop with ajax request 【发布时间】:2020-06-05 14:03:59 【问题描述】:我是新来的。
$.each(a, function (i, obj)
$('#labelid').html("inserting this data: "+obj.somedata);
// some other code
$.ajax(
// ajax request with insert
);
);
我有一个 each 循环,其中有一个 ajax 请求,它只插入一些数据,以及一些其他代码,主要用于更改一种“状态”标签(“插入这个:(一些数据)”)。
我的问题是当循环执行时,除了 ajax 请求之外,其中的代码一直迭代到最后,在我的标签中显示类似“插入这个:(最后一个元素行)”,而 ajax 请求仍在运行在后台。
我想实现这样的目标: 1. 标签显示“插入第一组数据” 2. ajax 请求插入第一组数据 3. 标签显示“插入第二组数据” 4.ajax请求插入第二组数据
这可能吗?我不想使用 async: false。
谢谢
【问题讨论】:
那么,你的意思是要延迟循环执行,直到循环内的ajax函数完成? @palaѕн 是的,我愿意 对于 ajax 选项添加 async: false, jQuery AJAX函数的异步设置默认值为true 为什么不想使用 async:false? 【参考方案1】:将您的 ajax 请求包装在一个 Promise 中并使用 await 调用该 Promise,因此代码的执行等待该 Promise 返回 ajax 请求的响应,您可以将标签设置为所需的格式。
const response = await new Promise((accept, reject) => $.ajax(
url: url,
type: "POST",
success: data => accept(data),
error: (request, status, error) => reject( request, status, error )
));
【讨论】:
【参考方案2】:这里是 jQuery Ajax 上的一个小承诺包装器。我认为它适用于$.each
。
const _ajaxAsync = url => new Promise((accept, reject) => $.ajax(
url: url,
type: "POST",
success: data => accept(data),
error: (request, status, error) => reject( request, status, error )
));
$.each(a, async function (i, obj)
$('#labelid').html("inserting this data: " + obj.somedata);
// some other code
let res = await _ajaxAsync('https://example.com').catch(e => console.log(e));
console.log(res);
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
【讨论】:
【参考方案3】:在这种情况下,for 循环将不起作用,因为请求是异步的。您有 2 个选项。
-
如果要使用 for 循环,请在 $.ajax 中将 async 设置为 false
采用递归方法,即仅在响应时发送下一个请求
的请求到达。这可以通过创建递归函数来完成。
【讨论】:
【参考方案4】:因为,Ajax 请求 是异步,所以你的循环不会等待它的响应并立即移动到下一个。要将 Ajax 作为 Synchronous 执行,您需要添加以下选项。
$.ajax(
async: false,
// your other options
)
【讨论】:
我已经尝试过了,页面只是冻结并插入数据库中的所有内容,完成后它只显示最后插入数据以上是关于如何解析JQUERY 通过AJAX请求来的HTML数据的主要内容,如果未能解决你的问题,请参考以下文章