Home/ Questions/Q 3681314
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-19T03:40:35+00:00

i have an ajax call and i am trying to parse the returned page

  • 0

i have an ajax call and i am trying to parse the returned page for #viewport, thereby removing the header and footer of the returned page. but find() cannot locate the div.

my original function:

        function(event) {
            $.ajax({
                type: this.method,
                url: this.action,
                data: $(this).serialize(),
                datatype: "html",
                success: function(data) {
                    alert(data);
                    var respHTML = $(data).find("#viewport");
                    alert(respHTML.length);
                    $("#contacts_sidebar").html(respHTML);
                }
            });
            return false;
        }

in the alert(data), i definitely see <div id="viewport">, but alert(respHTML.length) displays 0. if i change the selector to “table.someclass”, it would locate it. but selectors such as “head” and “body” returns 0 as well.

i know it’s definitely there b/c i replace the success handler with the following workaround:

        success: function(data) {
            var respHTML;
            var d=$(data);
            for (i=0; i<d.length; i++) {
                if (d[i]["id"] === "viewport") {
                    respHTML = d[i]["innerHTML"];
                    break;
                }
            }
            $("#contacts_sidebar").html(respHTML);
        }

am i missing something? the workaround works, just ugly.

thanks very much!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If '#viewport' is at the top level of the response HTML, you’ll need .filter() instead, since .find() only look inside the top level elements.

       success: function(data) {
        alert(data);
        var respHTML = $(data).filter("#viewport");
        alert(respHTML.length);
        $("#contacts_sidebar").html(respHTML);
    }

    When passing HTML to jQuery, you can’t rely on finding the <html> <head> <body> tags in a cross browser manner.

    If your response does include an entire HTML document, I would pare it down to only the content you actually want if at all possible.

    Another option may be to do something like this:

    var respHTML = $('<div>' + data + '</div>').find("#viewport");

    …but I wouldn’t guarantee the result.

    • 0