Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

So, I have a textarea that users are supposed to type codes into.

Ex: <div id="example">blar</div>

How can I evaluate what they enter in the textarea as HTML (as in the DOM) without:

  • jQuery
  • Having to create a new element

For example:

Code: <div id="ex">Blar</div>

My Function:

function parseCode(){
    var code = document.getElementById("code").value;
}

I want to take the value and make it accessible (like code.getElementsByTagName("div")[0].innerHTML);

share|improve this question
1  
Please apply markdown in your question to improve readability. –  apsillers May 25 '12 at 5:25
2  
I was just saying that the formatting of your question itself needed some improvement. I was not (yet) attempting to answer your question in any way. I have edited it slightly to make it more readable. –  apsillers May 25 '12 at 5:29
2  
Why the arbitrary-seeming restriction of not creating a new element? –  Phrogz May 25 '12 at 5:30
 
Oh. Ummm thanks...? –  RickyAYoder May 25 '12 at 5:30
 
Well, I guess I can create one, kinda with what Chris was saying. Isn't there something like document.evalute? –  RickyAYoder May 25 '12 at 5:34
show 3 more comments

2 Answers

up vote 2 down vote accepted 
var ele = document.createElement('div');
ele.innerHTML = document.getElementById('code').value;

This does not create a new element on the page itself, only in memory

share|improve this answer
 
And if I assigned it a className/id, I could access it and each of the children as what the user typed as their code, no? –  RickyAYoder May 25 '12 at 5:33
 
Yes, the html is evaluated when you assign it to the container's innerHTML property. All of the nodes defined in the user submitted HTML become actual child nodes of the newly created div, again, all in memory. –  Chris May 25 '12 at 5:34
 
Nice! concise. I didn't think of it :P –  Amogh Talpallikar May 25 '12 at 5:42
up vote 1 down vote

Assume that text is the string in the textarea. I hope this helps.

  if (window.DOMParser)
  {
    parser=new DOMParser();
    xmlDoc=parser.parseFromString(text,"text/xml");
  }
  else // Internet Explorer
 {
   xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
   xmlDoc.async=false;
   xmlDoc.loadXML(text); 
 }

Now xmlDoc should have the entire DOM object on which you can call getElementById and other methods.

share|improve this answer
 
Will this break if the input isn't proper XHTML? (Just asking; I seriously don't know.) –  apsillers May 25 '12 at 5:43
 
no but you would be able to check it programmatically and avoid the errors. But I doubt, we can do that if we assign a div with it as improper innerHTML. It will just get shown as plain text or not at all. If one is making something like what this guy is doing. He might want to inform the user that xhtml is not formed properly. –  Amogh Talpallikar May 25 '12 at 5:47
 
I dont have much experience in domparser either but I guess this should give the programmer more control over the dom. –  Amogh Talpallikar May 25 '12 at 5:48

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.