jQuery: Traversing AJAX response in Chrome/Safari

Posted by jitzo on Stack Overflow See other posts from Stack Overflow or by jitzo
Published on 2010-06-16T10:37:35Z Indexed on 2010/06/16 10:42 UTC
Read the original article Hit count: 429

Filed under:
|
|
|
|

I'm trying to traverse an AJAX response, which contains a remote web page (an HTML output).

My goal is to iterate through the 'script', 'link', and 'title' elements of the remote page - load them if necessary, and embed its contents to the current page.

Its working great in FF/IE, but for some reason - Chrome & Safari behaves differently: When I run a .each() loop on the response, Chrome/Safari seems to omit everything that is under the section of the page.

Here's my current code:

$.ajax({
    url: 'remoteFile.php',
    cache: false,
    dataFilter: function(data) { 
        console.log(data); 
        /* The output seems to contain the entire response, including the <head> section - on all browsers, including Chrome/Safari */

        $(data).filter("link, script, title").each(function(i) {
            console.log($(this)); 
            /* IE/FF outputs all of the link/script/title elements, Chrome will output only those that are not in the <head> section */
        });

        console.log($(data)); 
        /* This also outputs the incomplete structure on Chrome/Safari */

        return data;
    },
    success: function(response) {}
});

I've been struggling with this problem for quite a while now, i've found some other similar cases on google searches, but no real solution. This happens on both jQuery 1.4.2, and jQuery 1.3.2.

I really don't want to parse the response with .indexOf() and .substring() - it seems to me that it will be an overkill for the client.

Many thanks in advance!

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery