Uncomment html code using javascript

Question

Html tables with some commented tags. i just wanted to uncomment those tags. I have tried regex using javascript but problem is it removes entire commented line where as i just wanted to uncomment those tags. Below sample html table with commented tags...

<table>
   <tr>
         <td>ABCD</td>
         <td>Logic</td>
         <!-- <td>26538568</td> -->
   </tr>
</table>

So in above code i just want to uncomment <!-- <td>26538568<td> -->. Please this is part of data scraping from webpage, so i cannot change the html code. Above mentioned table structure is similar to web page from where i am trying extract the data.

Answer 1

There's a very useful little jquery plugin that does precisely this. I didn't write it, but it's open source and here's the code & attribution to original source:

http://vistaprint.github.io/SkinnyJS/jquery.uncomment.html

Works well on our site.

Javascript is:

(function ($) {
    $.fn.uncomment = function () {
        for (var i = 0, l = this.length; i < l; i++) {
            for (var j = 0, len = this[i].childNodes.length; j < len; j++) {
                if (this[i].childNodes[j].nodeType === 8) {
                    var content = this[i].childNodes[j].nodeValue;
                    $(this[i].childNodes[j]).replaceWith(content);
                }
            }
        }
    };
})(jQuery);

Just put your code into

<div class="commented-container">
  <!--
  <script src="some-expensive-widget.js"></script>
  <img src="some-expensive-widget-logo.jpg" />
  -->
</div>

and call it with

 $(".commented-container").uncomment();

We're using it to defer/exclude some image-heavy galleries for mobile users, to speed the page loads.

Part of skinny.js.. which you can find here: http://vistaprint.github.io/SkinnyJS/

Answer 2

You can do it by using the DOM, without treating the document as text. For example, using jQuery:

$('table tr')
 .contents()
 .filter(function(){return this.nodeType === 8;}) //get the comments
 .replaceWith(function(){return this.data;})

The interesting bit here is .contents, which returns all nodes, not just the elements - this includes text nodes and comments.

Working example: http://jsfiddle.net/9Z5T5/2/

Cautionary Note: I'm not sure how cross-browser is this. Specifically, it is possible node.data isn't supported. I've tested this code in Firefox, Chrome, and IE 10.