Question

我有两个HTML表格。每个只有三行一列。我想以编程方式加入它们，以便我得到一个包含两列和三行的表。

是否有某些功能或黑客来实现这一目标？我怎样才能做到这一点？

例如第一张表：

<table id="table_one">
   <tbody>
    <tr>
      <td>
         <label>data one</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data two</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data three</label>
      </td>
    </tr>
  </tbody>
</table>

第二张表：

<table id="table_two">
  <tbody>
    <tr>
      <td>
         <label>data one</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data two</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data three</label>
      </td>
    </tr>
  </tbody>
</table>

这是我想要的上述两个表：

<table id="table_three">
  <tbody>
    <tr>
      <td>
         <label>data one</label>
      </td>
      <td>
         <label>data one</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data two</label>
      </td>
      <td>
         <label>data two</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data three</label>
      </td>
      <td>
         <label>data three</label>
      </td>
    </tr>
  </tbody>
</table>

Answer 1

<table id="table_three">
  <tbody>
  </tbody>
</table>
<script type="text/javascript">
  jQuery(document).ready(function($){
    $('#table_one tr').each(function(index){
      var row = $(this);
      var row2 = $('#table_two tr').get(index);
      $(row).append($(row2).find('td'));
      $('#table_three').append($(row));
    });
   });
 </script>

Answer 2

我是这样做的：

// assume we have the tables in three strings:
// table_one in $str_1, table_two in $str_2, and table_three in $str_3.

// create $str_3 by copying $str_1 and replacing the table ID
$str_3 = $str_1;
$str_3 = str_replace('table_one', 'table_three', $str_3);

// load table_two and table_three in simple-html-dom and collect the TD elements
$tab_2 = str_get_html($str_2);
$tab_3 = str_get_html($str_3);

$tds_3 = $tab_3->find("td");
$tds_2 = $tab_2->find("td");

// go through the TDs in table_three and append the corresponding table_two TD
$acc = 0;
foreach ($tds_3 as &$td) {
    $td->outertext = $td->outertext . $tds_2[$acc]->outertext;
    $acc++;
}
// done!    
echo $tab_3;

Answer 3

嗯，这是一种继续（检查代码注释）的方法：

$table1 = <<<'_DATA_'
<table id="table_one">
   <tbody>
    <tr>
      <td>
         <label>data one</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data two</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data three</label>
      </td>
    </tr>
  </tbody>
</table>
_DATA_;


$table2 = <<<'_DATA_'
<table id="table_two">
  <tbody>
    <tr>
      <td>
         <label>data one</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data two</label>
      </td>
    </tr>
    <tr>
      <td>
         <label>data three</label>
      </td>
    </tr>
  </tbody>
</table>
_DATA_;

// Load teh 1st table
// Create a DOM object
$html1 = new simple_html_dom();
// Load HTML from a string
$html1->load($table1);


// Load teh 2nd table
// Create a DOM object
$html2 = new simple_html_dom();
// Load HTML from a string
$html2->load($table2);

// Find all rows from both tables
$rows1 = $html1->find('tr');
$rows2 = $html2->find('tr');

// Build teh 3rd table
$table3 =   '<table id="table_three">
                <tbody>';

// Insert rows cells from both initial tables
for ($i=0; $i < count($rows1); $i++) { 
    $table3 .=  '<tr>';

        // get row's innerhtml
        $table3 .=  $rows1[$i]->innertext;
        $table3 .=  $rows2[$i]->innertext;

    $table3 .=  '</tr>';
};

// finish the table
$table3 .=      '</tbody>
            </table>';

// Clear DOM objects
$html1->clear();
unset($html1);
$html2->clear();
unset($html2);

它创造了这个：

Answer 4

不确定我理解这个问题，但是：

   <?php

    // first and second table

    //Select data
    $reponse = $bdd->prepare('SELECT data1, data2 FROM '.RESEARCH.' WHERE X=X');                          
    $reponse->execute(array(X)); 
    ?>

    //Begin table
    <table id="table_one_or_two">
    <tbody>

    //Loop the rows
    while ($data = $reponse->fetch())
    { 
    <tr>
        <td>
           <label>$data['data1']</label>
        </td>
    </tr>

    }

    //end of loop, end of table
    </tbody>
    </table>



    // 3TH table

    //Select data
    $reponse = $bdd->prepare('SELECT data1, data2 FROM '.RESEARCH.' WHERE X=X');                          
    $reponse->execute(array(X)); 
    ?>

    //Begin table
    <table id="table_three">
    <tbody>

    //Loop the rows
    while ($data = $reponse->fetch())
    { 
    <tr>
        <td>
           <label>$data['data1']</label>
        </td>
        <td>
            <label>$data['data2']</label>
        </td>
    </tr>

    }

    //end of loop, end of table
    </tbody>
    </table>

PHP：如何将两个HTML表连接成一个？

4 个答案: