2017-02-11 96 views
0
<table id="administration" cellspacing="0" cellpadding="0"> 
     <thead> 
      <tr> 
       <th colspan="6" class="caption">Administration</th> 
      </tr> 
      <tr> 
       <th><span>Name</span></th> 
       <th><span>Monday</span></th> 
       <th><span>Tuesday</span></th> 
       <th><span>Wednesday</span></th> 
       <th><span>Thursday</span></th> 
       <th><span>Friday</span></th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td class="lalign">John Smith<br><span style="color: navy;text-align: center;">Leader</span></td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
      </tr> 
      <tr> 
       <td class="lalign">Vannessa Smith<br><span style="color: navy;text-align: center;">Lead Developer</span></td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Ex. Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
      </tr> 
      <tr> 
       <td class="lalign">Jane Phillips<br><span style="color: navy;text-align: center;">Git Officer</span></td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
       <td>Main Campus AM<br>Main Campus PM</td> 
      </tr> 
     </tbody> 
    </table> 

這是我硬編碼表如何生成/從我的JSON文件

我使用一個包含了人的日程安排一個JSON文件替換我的數據TD標籤。我的問題是什麼是最好/最簡單的方法來取代像主校園AM從我的文件

我還想提到,我有5個表,但每個表都有一個不同的id(上面這一個是管理)

我可以利用這段JavaScript代碼

v.mondayAM 
v.mondayPM 
v.tuesdayAM 
v.tuesdayPM 
v.wednesdayAM 
v.wednesdayPM 
v.thursdayAM 
v.thursdayPM 
v.fridayAM 
v.fridayAM 
v.saturdayAM 
v.saturdayPM 
+0

更適合一些輕量級的渲染框架,如jsRender/knockoutJs/reactjs等 – Developer

回答

1

如果名稱被硬編碼的訪問日程的每個人,你還不如一個id分配給<tr><tr id="leader">

然後你就可以更方便地使用這樣的:

$("td").filter(":contains('Campus AM')").remove() 
    $("#leader").append($("<td>").html(v.mondayAM + '<br>' + v.mondayPM)); 

如果這是一個對象,你可以在附加聲明使用for ...循環。

+0

現在硬編碼。我將數據移動到JSON對象中,因此它不會被硬編碼。 –

+0

使用這些對象,可以更容易地動態創建所需內容。 您可以清空''並根據用戶數據創建行,分配類,然後添加列等等。 – wlh