View Full Version : AJAX and document object?

05-01-2006, 04:31 PM
If I have a div in a document containing ordered lists (ul,li etc) and I use AJAX interaction with the server to modify the content of the div without page refresh, am I right in assuming that I cannot inspect or manipulate this new content using document.getElementById and similar methods of working with the document object? Or is there some way to do this?


05-01-2006, 04:46 PM
if you add a new element into the innerHTML of the div, you can manipulate as if it was originally part of the DOM. So yes, if you have an id attribute in an element, once it's in the innerHTML, you can use getElementById for it. That's the reason innerHTML is so slow compared to innerText, but FF doesn't have innerText. innerHTML actually processes the text going in.

05-01-2006, 06:15 PM

Ah, thanks. When I look at the DOM inspector, I do see the added elements there, yet if I try to get those elements in an array and alert with the length property of the array, the javascript console tells me that that element has no properties. Perhaps they have not loaded fully at the point I do the alert? Or what? Do I need some kind of special loader?


05-01-2006, 06:31 PM
Hmmm, I think the answer is that the element that ajax is adding to must already be defined in the document.


05-01-2006, 07:15 PM
gorilla1: Speculating is all nice and so, but it's not likely to give you the answer. Can you show us the code you're using to insert it into the document, and the code you're trying to access it with, please?

05-01-2006, 08:48 PM
I am affraid that, as long as you have inserted your AJAX new elements via innerHTML method and not via DOM methods, your elements will no longer take part of your DOM tree structure.

05-01-2006, 11:51 PM
If you want to update the DOM tree then you have to use the DOM methods to insert the content (as Kor said) as innerHTML does not update the DOM tree.

05-02-2006, 03:22 AM
Thanks... Yes, I am using innerthml to post the dynamic content from the server. I left the code at work, but it is pretty straightforward... An unordered list structured with javascript and containing hyperlinks. Onclick a request is generated to code on the server that returns additional list items to be added via innerhtml.


05-02-2006, 07:00 PM
How would you use DOM methods to insert the content?