简体   繁体   English

如何从ajax过滤返回数据的正文html?

[英]How do I filter body html the returned data from ajax?

My purpose is, I want to take specific html out from data and update that area only. 我的目的是,我想从数据中取出特定的html并仅更新该区域。

How do I filter the returned data from jQuery.ajax? 如何从jQuery.ajax过滤返回的数据?

This link is a old post but I do have the exactly same problem. 这个链接是一个老帖子,但我确实有完全相同的问题。

The solution giving from the link is $("[ref=B]").html(data).find( '[ref=A]' ); 从链接给出的解决方案是$("[ref=B]").html(data).find( '[ref=A]' );

However, if I do so, the entire page will write on <span ref='B'> first then find the selector inside of it..... 但是,如果我这样做,整个页面将首先在<span ref='B'>上写,然后找到它内部的选择器.....

The alternative way to only find '[ref=A]' is 找到'[ref = A]'的替代方法是

html = $(data).filter('[ref=B]').find('[ref=A]').html() // this way will work

none of these will work 这些都不会奏效

$(data).find('[ref=A]').html();
$(data).filter('[ref=A]').html();
$(data).filter('body').html();
$(data).find('body').html();

HTML HTML

`<body>

<span ref='B'><span ref='A'>abc</span></span>

</body>`

JS JS

 $(function() {
$.get(window.location.pathname + window.location.search, function(data){ alert(data);});
 });

Returned Data 返回的数据

<html>
<body>
    <span ref='B'><span ref='A'>abc</span></span>
</body>
</html>

My question is, is there a solution to filter body`s html from data which returned from $.ajax?? 我的问题是,是否有一个解决方案来从$ .ajax返回的数据中过滤body的html? like 喜欢

body_html = $(data).??????? 

then I can do whatever I want, like 然后我可以做任何我想做的事,比如

body_html.find('xxxx');

Thank you very much for your advice. 非常感谢您的建议。

You can use a DocumentFragment to simulate your html and do your search without appending it to the DOM . 您可以使用DocumentFragment来模拟您的html并进行搜索,而无需将其附加到DOM

// Create your DocumentFragment to be able to work without DOM
var body_html = document.createDocumentFragment();

// Convert and append data from your jQuery to work with fragment
body_html.appendChild($(data)[0]);

// Now you can select using your jQuery
var $body_html = $(body_html);

// Now you can use the find or whatever you want, like if it was in the DOM
$body_html.find('.foo');

// Or you can append in your current document, 
// but attention, after it the fragment reference is erased
$body_html.appendTo(document.body); 
// now you need to get reference again from body, 
// because your fragment doesn't exists anymore.

// So... if you try:
console.log(body_html); // undefined
console.log($body_html); // jquery over undefined, probably just a jquery useless

// At this point you will need to reference from DOM to continue manipulation
$body_html = $(document.body);
// Now I'm ready to continue the work
// This var is like your DocumentFragment, but already on DOM.

You also can do a filter in jQuery templating $(data).filter('.foo') but as you can see in this tests , your performance will drop a lot. 你也可以在jQuery模板化$(data).filter('.foo')进行过滤,但正如你在本次测试中看到的那样,你的表现会下降很多。

$("[ref=B]").append($(data).find("[ref=A]"));

The way you do it in your question, the last part find( '[ref=A]' ) is useless. 你在问题中的方式,最后一部分find( '[ref=A]' )是没用的。

[Edit] Also, the other question is more than 2 years old. [编辑]另外,另一个问题是超过2年。 For recent versions of jQuery you might need additional quotes: 对于最新版本的jQuery,您可能需要其他引号:

$("[ref='B']").append($(data).find("[ref='A']"));

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何对从 AJAX 调用返回的数据进行分组? - How do I group like data returned from an AJAX call? 我如何从ajax调用中获取返回的数据 - how to do i get returned data from ajax call 如何访问从 AJAX 请求返回的 JSON 数据? - How do I access JSON data returned from an AJAX request? 如何查找是否所有ajax请求都已完成,并且每个请求都使用Javascript和/或JQuery将数据从服务器返回到HTML? - How do I find whether all ajax requests are completed and each request returned data from server to HTML using Javascript and/or JQuery? 如何使用从 getJson 单击事件(从 href 触发)返回的数据填充模态主体? - How do I populate a modal body with the returned data from a getJson click event (fired from href)? 如何在JQuery中做到这一点? (获取从AJAX-GET返回的HTML,并将其变成一个对象) - How do I do this in JQuery? (get the HTML returned from AJAX-GET and turn it into an object) 如何执行Ajax调用返回的HTML中的内联JavaScript-JQUERY - How do I execute inline javascript in HTML returned from an ajax call - JQUERY 如何从Ajax中的动态html行传递数据? - How do I pass data from dynamic html rows in Ajax? 如何访问从 MVC 视图中的 ajax 调用调用的控制器返回的数据 - How do I access data returned from a controller invoked by an ajax call in an MVC View 如何解析从AJAX调用返回的HTML - How can I parse HTML returned from AJAX call
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM