my dog learned polymorphism*
The moose likes HTML, CSS and JavaScript and the fly likes creating a dom from an html string Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "creating a dom from an html string" Watch "creating a dom from an html string" New topic
Author

creating a dom from an html string

jonathan Greens
Ranch Hand

Joined: Apr 07, 2004
Posts: 139
I need to construct a dom object from a string, is it possible to do this?
I can't open up a new document or write the string to the current document using document.writeln(). I need to parse the string and get one of the element inside it.
thanks
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
You can use innerHTML and document.getElementById() or document.getElementsByTagName() depending on your need.

Eric
jonathan Greens
Ranch Hand

Joined: Apr 07, 2004
Posts: 139
in order to use innerHTML i need to have a table cell first, and by writing the string to innerHTML it would show up. Is there an invisible way to do it?
thanks
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
what is an example string that you have and I may be able to help you out with a better solution.

Eric
jonathan Greens
Ranch Hand

Joined: Apr 07, 2004
Posts: 139
the string is basically the content of a simple jsp page and the element I am trying to get is
<div id="status"><%=percent%></div>
I thought about using a third party javascript xml parser but thought maybe there's an easier solution.
jonathan Greens
Ranch Hand

Joined: Apr 07, 2004
Posts: 139
I tried using innerHTML as follows:
var el=document.createElement("TD");
alert("el is "+el);
el.innerHTML="<div id='hi'>test</div>";

alert(document.getElementById("hi"));

el is created but the second alert gives null so it can't find the div element inside the table cell. what's wrong?
Shiva Madhavan
Greenhorn

Joined: Dec 22, 2005
Posts: 1
function(htmlString,idOfElement){
var newDiv = document.createElement("DIV");
newDiv.setAttribute("id","hiddenDiv");
newDiv.setAttribute("style","display:none");
newDiv.innerHTML = htmlString;
document.getElementsByTagName("body")[0].appendChild(newDiv);
var interestedElement = document.getElementById(idOfElement);
/* the created div exists on the dom but is not shown to the user ..
because u have set the style property display to none
the reference to the element is returned .. u can use it to fetch the contents of the div
*/
return ineterestedElement;
}

corrected a few mistakes from ym first post...
as for the reason why your code didn't work .. u jus missed out appending the element u created to the document as shown below ..
document.getElementsByTagName("body")[0].appendChild(newDiv);
and to u use the display property so that the elemnt doesn't show up even when you attach it to the document ...
hope this helps ..

and Mr. Eric Pascarello, i am really glad i found the book you co-authored ... helped me understand and look at AJAX in a very oraganised way..
refactoring , all those patterns ... really helped .. and it is really important when coding with a less structured language like javascript ..



Happy Holidays ..

[ December 22, 2005: Message edited by: Shiva Madhavan ]

[ December 22, 2005: Message edited by: Shiva Madhavan ]
[ December 23, 2005: Message edited by: Shiva Madhavan ]
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: creating a dom from an html string