How do I do OuterHTML in firefox?

by

Here’s the function we use in pure.js:

function outerHTML(node){
    return node.outerHTML || new XMLSerializer().serializeToString(node);
}

To use it the DOM way:

outerHTML(document.getElementById('theNode'));

And it works cross browsers

EDIT: WARNING!
There is a trouble with XMLSerializer, it generates an XML(XHTML) string.
Which means you can end up with a tags like <div class="team" /> instead of
<div class="team"></div>
Some browsers do not like it. I had some pain with Firefox 3.5 recently.

So for our pure.js lib we came back to the old and safe way:

function outerHTML(node){
    // if IE, Chrome take the internal method otherwise build one
  return node.outerHTML || (
      function(n){
          var div = document.createElement('div'), h;
          div.appendChild( n.cloneNode(true) );
          h = div.innerHTML;
          div = null;
          return h;
      })(node);
  }

More Related Contents:

  1. Browser detection versus feature detection
  2. How to add/remove a class in JavaScript?
  3. Get the string representation of a DOM node
  4. event.toElement in IE8 and Firefox?
  5. What’s the most concise cross-browser way to access an element’s window and document?
  6. What is JavaScript’s highest integer value that a number can go to without losing precision?
  7. How to pass arguments to addEventListener listener function?
  8. How to fix Array indexOf() in JavaScript for Internet Explorer browsers
  9. Check if element is visible in DOM
  10. Why don’t we just use element IDs as identifiers in JavaScript?
  11. How to append text to a “?
  12. Memory leak risk in JavaScript closures
  13. browser sessionStorage. share between tabs?
  14. Prevent zoom cross-browser
  15. Intercepting call to the back button in my AJAX application
  16. Why are duplicate ID values not allowed in HTML?
  17. HTML “overlay” which allows clicks to fall through to elements behind it [duplicate]
  18. Finding element’s position relative to the document
  19. React.js: onChange event for contentEditable
  20. jQuery DOM changes not appearing in view source
  21. How do I put codes from jsfiddle.net into my website?
  22. Screen Scraping from a web page with a lot of Javascript [closed]
  23. IE8 alternative to window.scrollY?
  24. Attach event listener through javascript to radio button
  25. Is there any problem with using HTML5’s “data-*” attributes for older browsers?
  26. Why is React’s concept of Virtual DOM said to be more performant than dirty model checking?
  27. Convert String to XML Document in JavaScript
  28. Is there a way to get innerText of only the top element (and ignore the child element’s innerText)?
  29. IE support for DOM importNode
  30. How to prevent an iframe from reloading when moving it in the DOM

Leave a Comment