循環TD的內容與垂直軸表到特別div格式

Question

我有垂直軸表（每個第一列）這樣的

<table id="tbl-hn"> 
<tr> 
    <td>Title A</td><td>a1</td><td>...</td><td>a10</td> 
</tr> 
<tr> 
    <td>Title B</td><td>b1</td><td>...</td><td>b10</td> 
</tr> 
<tr> 
    <td>Title C</td><td>c1</td><td>...</td><td>c10</td> 
</tr> 
</table> 

我可以循環在這個表中的所有此類內容：

<div class="content"> 
<div> 
    <div>Title A:</div><div>a1</div> 
    <div>Title B:</div><div>b1</div> 
    <div>Title C:</div><div>c1</div> 
</div> 
<div> 
    <div>Title A:</div><div>a...</div> 
    <div>Title B:</div><div>b...</div> 
    <div>Title C:</div><div>c...</div> 
</div> 
<div> 
    <div>Title A:</div><div>a10</div> 
    <div>Title B:</div><div>b10</div> 
    <div>Title C:</div><div>c10</div> 
</div> 

Answer 1

請檢查該Fiddle。這會幫助你。

Answer 2

<p id="demo"></p> 

    <script> 
      var title = ["Title A", "Title B", "Title C"]; 

      var alp= ["a", "b", "c"]; 

      var text = ""; 

      var i; 
      var j; 

      for(j = 0; j < 10; j++) 
      { 
        for (i = 0; i < 3; i++) 
        { 
          text += title[i] + " " + alp[i] +""+ j + "<br>"; 
        } 
        text+="<br>" 
      } 
      document.getElementById("demo").innerHTML = text; 
    </script> 

    </body>