如何过滤 jQuery.ajax() 返回的数据？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4245231/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I filter the returned data from jQuery.ajax()?
提问by smix96
When using the jQuery.ajax()method, I am struggling to filter the data that is returned to get exactly what I need. I know this is easy using .load()and probably the other jQuery AJAX methods but I need to use .ajax()specifically.
使用该jQuery.ajax()方法时，我正在努力过滤返回的数据以获得我需要的数据。我知道这很容易使用.load()，可能还有其他 jQuery AJAX 方法，但我需要.ajax()专门使用。
For example I know that this works;
例如，我知道这行得通；
var title = $(data).filter('title'); // Returns the page title
But what if I just want the contents of a div with id="foo"?
但是如果我只想要 id="foo" 的 div 的内容呢？
var foo = $(data).filter('#foo'); // None of these work
var foo = $(data).find('#foo'); //
var foo = $('#foo', data); //
Ideally, I want one method into which I can pass a normal jQuery selector, which will work for selecting titles, divs, or any other element that jQuery can select. This is so that I can pass in any string into my own ajax function - eg;
理想情况下，我想要一种方法，我可以向其中传递一个普通的 jQuery 选择器，该选择器可以用于选择标题、div 或 jQuery 可以选择的任何其他元素。这样我就可以将任何字符串传递到我自己的 ajax 函数中 - 例如；
myApp.ajax({
url: 'myPage.html',
filterTitle: 'title',
filterContent: '#main-content'
});
Any help would be greatly appreciated.
任何帮助将不胜感激。
采纳答案by ?ime Vidas
The use of filter()vs. find()depends on the structure of your retrieved HTML page. For example, if this is the retrieved page:
filter()vs.的使用find()取决于您检索到的 HTML 页面的结构。例如，如果这是检索到的页面：
<!DOCTYPE html>
<html>
<head>
<title>Foo</title>
</head>
<body>
<div id="wrap">
<div id="header">
<h1>Foo</h1>
</div>
<div id="body"> content </div>
</div>
<div id="tooltip"> tooltip </div>
</body>
</html>
If you want to select the top-level elements = elements that are direct children of <body>- in this example: #wrapor #tooltip- then you have to use filter().
如果要选择顶级元素 = 直接子元素的元素<body>- 在此示例中：#wrap或#tooltip- 那么您必须使用filter().
If you want to select other elements - in this example: #header, <h1>, #body, ... - then you have to use find().
如果您想选择其他元素 - 在本例中：#header, <h1>, #body, ... - 那么您必须使用find().
I you don't know whether your element is a child of <body>or not, you could use this "hack":
我不知道你的元素是否是它的子元素<body>，你可以使用这个“hack”：
$("<div>").html(data).find( selector );
$("<div>").html(data).find( selector );
By using this work-around, you always get the elements via find().
通过使用此变通方法，您始终可以通过find().
回答by Matt
The jQuery.loadmethod uses the following code:
该jQuery.load方法使用以下代码：
// If successful, inject the HTML into all the matched elements
if ( status === "success" || status === "notmodified" ) {
// See if a selector was specified
self.html( selector ?
// Create a dummy div to hold the results
jQuery("<div />")
// inject the contents of the document in, removing the scripts
// to avoid any 'Permission Denied' errors in IE
.append(res.responseText.replace(rscript, ""))
// Locate the specified elements
.find(selector) :
// If not, just inject the full result
res.responseText );
}
I.e it appends the full response to a DIV it creates, and then uses find(selector)on that.
即它将完整的响应附加到它创建的 DIV，然后使用find(selector)它。
So you should be looking at something like:
因此，您应该查看以下内容：
var foo = $('<div />').html(data).find('#foo'); // This looks like it'll work!
Bit of a hack from jQuery's point of view!
从 jQuery 的角度来看，有点小技巧！
回答by John Magnolia
This is how I was able to get it working thanks to @Matt
感谢@Matt，这就是我能够让它工作的方式
$.ajax({
type: "GET",
url: url,
dataType: 'html',
success: function(data) {
$('#foo').html(
$('<div />').html(data).find('#foo').html()
);
}
});
回答by Volker Rose
If you don't need any special functionality given by the full $.ajaxmethod, you should give $.load()a try:
如果您不需要完整$.ajax方法提供的任何特殊功能，您应该$.load()尝试一下：
The .load() method, unlike $.get(), allows us to specify a portion of the remote document to be inserted. This is achieved with a special syntax for the url parameter. If one or more space characters are included in the string, the portion of the string following the first space is assumed to be a jQuery selector that determines the content to be loaded.
.load() 方法与 $.get() 不同，它允许我们指定要插入的远程文档的一部分。这是通过 url 参数的特殊语法实现的。如果字符串中包含一个或多个空格字符，则字符串中第一个空格后面的部分将被假定为 jQuery 选择器，用于确定要加载的内容。
$('#result').load('ajax/test.html #container');
回答by Lorenzo
Use
用
$(data).filter("#foo").text();
I am using this to filter the result of an ajax call that return an HTML conent
我正在使用它来过滤返回 HTML 内容的 ajax 调用的结果
