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!