JSFiddle - React, Tailwind, and code Playground

by Ian Gray

HTML

<table class="qprintable" width="600" cellpadding="0" cellspacing="1" border="0">
        <tbody><tr>
                <td valign="top" width="200">
                        <table class="qprintable2" width="100%" cellpadding="4" cellspacing="0" border="0">
                <tbody><tr class="phead">
                    <td><b> Peter "mofo" Pan </b> 
                         
                        </td>
                </tr>
                <tr>
                    <td valign="top">
                        <div class="first"></div>
                        <div>[email protected]</div>
                        <div class="last">
                                            
                        </div>
                    </td>
                </tr>
            </tbody></table>
                    </td>
                <td valign="top" width="200">
                        <table class="qprintable2" width="100%" cellpadding="4" cellspacing="0" border="0">
                <tbody><tr class="phead">
                    <td><b> Spider,",Man </b> 
                         
                        </td>
                </tr>
                <tr>
                    <td valign="top">
                        <div class="first"></div>
                        <div>[email protected]</div>
                        <div class="last">
                                            
                        </div>
                    </td>
                </tr>
            </tbody></table>
                    </td>
                <td valign="top" width="200">
                        <table class="qprintable2" width="100%" cellpadding="4" cellspacing="0" border="0">
                <tbody><tr class="phead">
                    <td><b> Banana Man,</b> 
                         
                        </td>
                </tr>
                <tr>
                    <td valign="top">
                        <div class="first"></div>
                       ...

CSS

table {
    border: 3px solid red;
}
table table {
    border: 3px solid blue;
    margin: 3px;
}
#result, #json {
    background: #EEE;
    border-radius: 10px;
    border: 1px solid black;
    margin: 5px;
    padding: 5px;
    font-family: monospace;
}

JavaScript

if(false){

// javascript:prompt('','javascript:'+encodeURIComponent(prompt('','')));    
    
// javascript:
(function(){

function toCSV( rows ){
    var newline = '\n';
    var fsep = ',';
    var quot = '"';
    var quotquot = [ quot + quot, '\\' + quot ][1];
    var alwaysQuote = false;
    var quoteIfContainsQuote = true;
    var lines = [];
    $.each( rows, function(){
      var line = [];
      $.each( this, function(){
          var s = this;
          var needsQuote = alwaysQuote;

          if( s.indexOf( fsep ) >= 0 )
              needsQuote = true;

          if( s.indexOf( quot ) >= 0 ){
              needsQuote = needsQuote || quoteIfContainsQuote;
              s = s.replace( quot, quotquot );
          }

          if( needsQuote ) s = quot + s + quot;
          line.push( s );
      });
      lines.push( line.join( fsep ));
    });
    return lines.join( newline );
}
            
function xtract( rootTableSelector ){
    var rows = [];
    var csv = [];
    csv.push(['Name','Email']);
    $( rootTableSelector ).each(function(){
        var $t = $(this);
        var row = {};
        row.name  = $.trim( $t.find('tr:nth-child(1) > td > b').text());
        row.email = $.trim( $t.find('tr:nth-child(2) > td > div:nth-child(2)').text());
        rows.push( row );
        csv.push([ row.name, row.email ]);
    });
    csv = toCSV( csv );
    $('<textarea/>').text( csv ).css({
      position: 'fixed'
     ,width: '80%'
     ,height: '80%'
     ,top: '10%'
     ,left: '10%'
    }).appendTo('body').focus().select();
}

    var s=document.createElement('script'); 
  s.setAttribute('src','http://code.jquery.com/jquery.min.js'); 
  s.setAttribute('type', 'text/javascript');
  document.getElementsByTagName('body')[0].appendChild(s);

  function f(){
    var $=window.jQuery;
    if(!$){setTimeout(f,100);return;}
    $(function(){
        xtract('.qprintable2');
    });
  }
  f();


})();    
}