2017-08-23 26 views
0

在我的代碼,我有這一塊是預謀表排進名單

<ul id="more-menu" class="more-menu arrow_box"> 
... 
</ul> 

在我的.js文件我想要的元素添加到這個列表和其中的一個部分應該是與表一排,將容納圖標,我的代碼添加表:

$(".more-menu.arrow_box").prepend('</table>' + '</li>'); 

     $(".more-menu.arrow_box").prepend("<td id='4th'>XYZ</td>"); 

     $(".more-menu.arrow_box").prepend("<td id='3rd'>XYZ</td>"); 

     $(".more-menu.arrow_box").prepend("<td id='2nd'>XYZ</td>"); 

     $(".more-menu.arrow_box").prepend("<td id='1st'>XYZ</td>"); 

    $(".more-menu.arrow_box").prepend("<li style='background-color: #444444'><table class='ribbon-menu'>"); 

基本上他們三個都只是一個跨度(點擊圖標)DIV,一個是與它的一些元素另一個箭頭框。

而作爲一個結果我得到:

<li style="background-color: #444444"><table class="ribbon-menu"></table></li> 

通過<td></td>元素

+2

你的問題,是因爲你的邏輯是錯誤的。您一次只能追加*整個元素,而不能開始/結束標籤。要做你需要的東西,你需要在現有的'ul'上添加'li',然後在'li'上添加'table',然後在'tr'後添加't'。或者,你可以把它放在一個單一的字符串,並將其附加到'ul' –

+0

有什麼方法可以追加像我想要的元素? 問題是因爲每個內部單元格都在if句子中 – SyntaxError

+1

您可以將其構建爲單個字符串,然後在邏輯結尾處追加一次 –

回答

0

folowed在DOM正確構造

一種可能性如何將一塊數據塊是插入完整的外部元素進入對象空間並在之後相應地改變它們。

這樣:

$(".more-menu.arrow_box").prepend("<li style='background-color: #444444'><table class='ribbon-menu'></table></li>"); 
table = $(".more-menu.arrow_box").children().first().find('table') 
table.append("<td id='1st'>XYZ</td>") 
table.append("<td id='2nd'>XYZ</td>") 
table.append("<td id='3rd'>XYZ</td>") 
table.append("<td id='4th'>XYZ</td>") 

雖然創建一個用於數據的<tr>也將是不錯的:)