发表新帖
发表新帖

How do I filter the returned data from jQuery.ajax()?

前端 未结
关注
5 1652
猫巷女王i
猫巷女王i 2020-11-30 01:48

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()

相关标签:
5条回答
  • 小鲜肉
    2020-11-30 02:28

    The use of filter() vs. find() depends on the structure of your retrieved HTML page. For example, if this is the retrieved page: 

    <!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: #wrap or #tooltip - then you have to use filter().

    If you want to select other elements - in this example: #header, <h1>, #body, ... - then you have to use find().

    I you don't know whether your element is a child of <body> or not, you could use this "hack":

    $("<div>").html(data).find( selector );

    By using this work-around, you always get the elements via find().

    0 讨论(0)
  • 粉色の甜心
    2020-11-30 02:40

    This is how I was able to get it working thanks to @Matt

    $.ajax({
    type: "GET",
    url: url,
    dataType: 'html',
    success: function(data) {
        $('#foo').html(
            $('<div />').html(data).find('#foo').html()
        );
    }
});
    0 讨论(0)
  • 别跟我提以往
    2020-11-30 02:43

    The jQuery.load method uses the following code:

    // 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.

    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!

    0 讨论(0)
  • 后悔当初
    2020-11-30 02:45

    If you don't need any special functionality given by the full $.ajax method, you should give $.load() a try:

    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.

    $('#result').load('ajax/test.html #container');

    http://api.jquery.com/load/#loading-page-fragments

    0 讨论(0)
  • 滥情空心
    2020-11-30 02:50

    Use 

    $(data).filter("#foo").text();

    I am using this to filter the result of an ajax call that return an HTML conent

    0 讨论(0)
 看不清?
提交回复
热议问题