Can Javascript Access The Dom Of An Ajax Text/html Response?

I'm trying to use Ajax to fetch an HTML page and then pull out a div by it's ID, and insert that DIV into the current page. So the current page loads (via Ajax) a second page, pull

Solution 1:

Jquery (or other libraries??) will basically do all this for you. I highly recommend looking into this and not reinventing the wheel.

For query it would probably like:

// Make a call to url, with data 
$.ajax(
  { url: $url,
    data: $data, 
    dataType: 'xml',
    callback: function(returnData) { 
      // Jquery find <mytag attribute="foo">...</mytag> and store it in mydatavar mydata = $(returnData).find('mytag[attribute=foo]');
      // Insert into current page to somewhere with class="after-me"
      $('.after-me').html(mydata);
   }
});

I may have the syntax wrong. But here is the docs: http://docs.jquery.com/Ajax/jQuery.ajax#options

Solution 2:

Yes you can. Here you will find a resource for how to parse XML responses.

If you are loading it into the DOM tree that already exists (innerHTML), you should be able to call the standard DOM traversal functions you are used to.

Solution 3:

Don't worry about validity, since you are doing this dynamically using javascript, you can fill hidden element's innerHTML with your response data and then use any DOM/jQuery functions you wish

Solution 4:

script tags will fail on any browser by any method.. so to access current page's dom apply the "eval" function on the script text which you currently requested.

i mean, if you have html like:

<div id="content">some html</div>

and you got the script text on server side like

content.innerHTML = "foo";

use the eval function on ajax response

function onXmlHttpAnswer()
{
   if(xmlHttp.readyState==4 && xmlHttp.status==200)eval(xmlHttp.responseText);
}

Solution 5:

In order to use jQuery to extract only a portion of an HTML document loaded via $.load() do this:

$('#dynamic').load('content.html #desiredElement');

.load will actually load the entire document, but the selector will force load to only return the selected portion of that document.