Results 1 to 8 of 8

Thread: Getting HTML code of an element

  1. #1
    Join Date
    Oct 2007
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Getting HTML code of an element

    How can I get complete HTML code of an element from JavaScript?

    I'm sending id of a div element to a JavaScript function. And I'm getting it's DOM equalant using document.getElementById(<the div tag id>).

    I want to get HTML code of that element. If I use innerHTML, i will get inner HTML i.e., it doesn't contain that <div> tag whose id is passed. Instead it gives us code within that <div> tag. How can I get complete HTML of that element?

    Thanks in advance.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

  3. #3
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    If you're doing this, however, there's probably something wrong with the design of your script: the DOM should never be represented as a string. Why do you want to do it?
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    It can be a handy tool in crafting a script. But Twey is otherwise correct. There is almost always an easier and more standard way to do things than to resort to what is basically outerHTML (supported most fully only in IE).
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Oct 2007
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Leave DOM and all these. I want to get complete HTML code of a <div> element. If I use innerHTML,
    I will get HTML code inside that tag. I want code including that tag.

    What should I have to do?

  6. #6
    Join Date
    Oct 2007
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by BNArun View Post
    Leave DOM and all these. I want to get complete HTML code of a <div> element. If I use innerHTML,
    I will get HTML code inside that tag. I want code including that tag.

    What should I have to do?

    I used outerHTML. It worked fine in IE7. But it is not working in FF2.

  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    As noted earlier, outerHTML is only most fully supported in IE. Have a look at this:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    var hh='';
    function outerH(el){
    if(typeof el.outerHTML=='string'&&el.outerHTML.length)
    return el.outerHTML;
    var tmp=document.createElement('div');
    tmp.appendChild(el.cloneNode(true));
    setTimeout(function(){tmp=null;},200);
    return tmp.innerHTML;
    }
    </script>
    </head>
    <body>
    <div style="color:black;background-color:yellow;" onmouseover="alert(outerH(this));">Howdy World!</div>
    <span id="test">Wazzup?<br></span>
    <input type="button" onclick="hh=outerH(document.getElementById('test'));" value="Set"><br>
    <input type="button" onclick="alert(hh);" value="Read">
    </body>
    </html>
    Notes: There is probably another way of doing whatever your ultimate goal is, one that avoids this, which is pretty non-standard regardless of which method a browser may support because no future browser will ever be required to support either, and I believe that some current browsers will not support either if your page is served as (otherwise) valid XHTML.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    I want to get complete HTML code of a <div> element.
    You shouldn't want to do this. That you are attempting it means that your design is poor.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •