2013-04-04 48 views
0

我有一個包含5列和幾行的基本表格的頁面。每一個圓桌代表一個工作日,每一行代表菜單上的不同菜。我想創建一個只顯示今天菜單的頁面。從現有的html獲取表格數據

我對此表沒有寫入權限。 (如果有必要,我可以要求網站管理員進行一些修改)

對於我來說,顯示ID =「星期一」的所有內容似乎是邏輯,但我無法設法從中獲取任何內容。

這是現有的表:

 <table cellpadding="4" class="weeklymenu" width="100%"> 
     <tbody> 
     <tr ID="day"> 
      <th ID="monday" scope="col" width="20%">Monday</th> 
      <th ID="tuesday" scope="col" width="20%">Tuesday</th> 
      <th ID="wednesday" scope="col" width="20%">Wednesday</th> 
      <th ID="thursday" scope="col" width="20%">Thursday</th> 
      <th ID="friday" scope="col" width="20%">Friday</th> 
     </tr> 
     <tr ID="date"> 
      <td ID="monday" class="date" width="151">08/04/2013</td> 
      <td ID="tuesday" class="date" width="179">09/04/2013</td> 
      <td ID="wednesday" class="date" width="144">10/04/2013</td> 
      <td ID="thursday" class="date" width="141">11/04/2013</td> 
      <td ID="friday" class="date" width="152">12/04/2013</td> 
     </tr> 
      <tr ID="first"> 
       <td class="piatti" colspan="5" width="779"> 
        <strong>First dish/Primi</strong> 
       </td> 
      </tr> 
      <tr ID="first"> 
       <td ID="monday" height="27" width="151">Riso in bianco</td> 
       <td ID="tuesday" height="27" width="179">Pancetta piacentina</td> 
       <td ID="wednesday" height="27" width="144">Riso in bianco</td> 
       <td ID="thursday" height="27" width="141">Insalata russa</td> 
       <td ID="friday" height="27" width="152">Riso in bianco</td> 
      </tr> 
      <tr ID="first"> 
       <td ID="monday" height="29" width="151">Zuppa d'orzo</td> 
       <td ID="tuesday" height="29" width="179">Minestra di cicerchie</td> 
       <td ID="wednesday" height="29" width="144">Minestra di fagioli adzuki</td> 
       <td ID="thursday" height="29" width="141">Crema di sedano</td> 
       <td ID="friday" height="29" width="148">Passato di legumi cpon crostini</td> 
      </tr> 
      <tr ID="first"> 
       <td ID="monday" height="48" width="151">Gnocchetti sardi broccoli e salsiccia</td> 
       <td ID="tuesday" height="48" width="179">Risotto alla milanese</td> 
       <td ID="wednesday" height="48" width="144">Pennette alla puttanesca</td> 
       <td ID="thursday" height="48" width="141">Conchiglie tonno e capperi</td> 
       <td ID="friday" height="48" width="148">Caserecce zafferano panna e speck</td> 
      </tr> 
      <tr ID="second"> 
      <td class="piatti" colspan="5" height="30" width="779"> 
       <strong>Second dish/Secondi</strong> 
      </td> 
     </tr> 
     <tr ID="second"> 
      <td ID="monday" width="151">Controfiletto di puledro</td> 
      <td ID="tuesday" width="179">Fesa di tacchino ai ferri</td> 
      <td ID="wednesday" width="144">Spezzatino alla goriziana</td> 
      <td ID="thursday" width="141">Verzini in umido</td> 
      <td ID="friday" width="148">Vitello tonnato</td> 
      </tr> 
      <tr ID="second"> 
       <td ID="monday" height="43" width="151">Cotoletta di tofu con verdure</td> 
       <td ID="tuesday" height="43" width="179">Tortino crecy</td> 
       <td ID="wednesday" height="43" width="144">Mozzarella di bufala</td> 
       <td ID="thursday" height="43" width="141">Ebly primaverile</td> 
       <td ID="friday" height="43" width="148">Falafel con salsa tzatziki</td> 
      </tr> 
      <tr ID="second"> 
       <td ID="monday" height="52" width="151">Prosciutto crudo con melone</td> 
       <td ID="tuesday" height="52" width="179">Persico del Nilo agli asparagi</td> 
       <td ID="wednesday" height="52" width="144">Arrosticini di suino al forno</td> 
       <td ID="thursday" height="52" width="141">Paillard di vitello alla piastra</td> 
       <td ID="friday" height="52" width="148">Trancio di salmone al forno</td> 
      </tr> 
      <tr ID="side"> 
       <td class="piatti" colspan="5" height="28" width="779"> 
        <strong>Side dishes/Contorni</strong> 
       </td> 
      </tr> 
      <tr ID="side"> 
       <td ID="monday" height="28" width="151">Patatine fritte</td> 
       <td ID="tuesday" height="28" width="179">Patate prezzemolate</td> 
       <td ID="wednesday" height="28" width="144">Purè di patate</td> 
       <td ID="thursday" height="28" width="141">Patate al rosmarino</td> 
       <td ID="friday" height="28" width="148">Patate al naturale</td> 
      </tr> 
      <tr ID="side"> 
       <td ID="monday" height="28" width="151">Cavolfiori alla parmigiana</td> 
       <td ID="tuesday" height="28" width="179">Pomodori alla provenzale</td> 
       <td ID="wednesday" height="28" width="144">Piselli alla francese</td> 
       <td ID="thursday" height="28" width="141">Melanzane alla positana</td> 
       <td ID="friday" height="28" width="148">Fagiolini all'olio</td> 
      </tr> 
      <tr ID="desert"> 
       <td class="piatti" colspan="5" height="28" width="779"> 
        <strong>Dessert/Dolci</strong> 
       </td> 
      </tr> 
      <tr ID="desert"> 
       <td ID="monday" height="31" width="151">Crostatine al limone</td> 
       <td ID="tuesday" height="31" width="179"> Budino</td> 
       <td ID="wednesday" height="31" width="144">Macedonia</td> 
       <td ID="thursday" height="31" width="141">Profitterol al cioccolato</td> 
       <td ID="friday" height="31" width="148">Fragole</td> 
      </tr> 
      <tr ID="desert"> 
       <td ID="monday" width="151"/> 
       <td ID="tuesday" width="179"> </td> 
       <td ID="wednesday" width="144"> </td> 
       <td ID="thursday" width="141"> </td> 
       <td ID="friday" width="152"> </td> 
      </tr> 
      <tr ID="ingredients"> 
       <td ID="monday" class="date" width="151">Ingredients</td> 
       <td ID="tuesday" class="date" width="179">Ingredients</td> 
       <td ID="wednesday" class="date" width="144">Ingredients</td> 
       <td ID="thursday" class="date" width="141">Ingredients</td> 
       <td ID="friday" class="date" width="152">Ingredients</td> 
     </tr> 
     </tbody> 
    </table> 
+0

你永遠可以東西與相同ID – theshadowmonkey 2013-04-04 15:29:14

+0

這是不好的做法,使用相同的CSS ID超過一次在一頁上。相反,使用CSS類會更好(' 2013-04-04 15:32:57

回答

0

我修改你的表有類和下調錶,只是有兩行和操作使用jQuery的。

這是HTML

<table> 
    <tbody> 
    <tr ID="day"> 
     <th class="monday" scope="col" width="20%">Monday</th> 
     <th class="tuesday" scope="col" width="20%">Tuesday</th> 
     <th class="wednesday" scope="col" width="20%">Wednesday</th> 
     <th class="thursday" scope="col" width="20%">Thursday</th> 
     <th class="friday" scope="col" width="20%">Friday</th> 
    </tr> 
    <tr ID="date"> 
     <td class="monday" class="date" width="151">08/04/2013</td> 
     <td class="tuesday" class="date" width="179">09/04/2013</td> 
     <td class="wednesday" class="date" width="144">10/04/2013</td> 
     <td class="thursday" class="date" width="141">11/04/2013</td> 
     <td class="friday" class="date" width="152">12/04/2013</td> 
    </tr> 
    </tbody> 
</table> 

這是我用來獲取數據的JavaScript。你可以做任何你想要使用多個條件

var data = ''; 
$('.monday').each(function() { 
    data += $(this).html(); 
}); 
alert(data); 

和鏈接到撥弄它是 http://jsfiddle.net/f2sTT/1/

+0

謝謝,但我想我沒有讓自己變得很清楚。我需要在另一個運行在我的服務器上的HTML頁面的表格中獲取輸出。以便我的服務器從其他服務器檢索數據。 (有點像rss提要)我認爲你的腳本必須與每週菜單位於同一頁面上。 是否可以在其他頁面上引用此腳本並參考外部源?我錯誤地認爲這是可能的嗎? [code] var data =''; ()。()。 $('。monday')。each(function(){ data + = $ www.blabla.com/page1.html(); }); alert(data); [/ code] – user2245429 2013-04-05 08:16:52

+0

@ user2245429如果你不能一部分得到它,然後將該表附加到你的頁面並操作它,你不能從外部源下載數據嗎? – theshadowmonkey 2013-04-05 15:06:11

+0

嗯,該網頁每週更新,我希望我的網頁每天自動獲取數據。而不必修改它(永遠)... vik – user2245429 2013-04-05 17:47:31