鏈接jQuery的附加

Question

我想弄清楚如何可以鏈接多個附加到我的標記。基本上追加一個元素後，我希望下一個元素將它追加到第一個附加元素。我希望我的意思是有道理的。

如果你看看我的代碼，我只是將元素<ul class="menu" />添加到元素#footer .research-centers-menu .research中。

然後在下面的代碼，我試圖插入/追加變量centers到<ul class="menu" />

的電流輸出，現在沒有插入元素，但它放在外面來代替。我的英文不好道歉，並解釋

var researchCenters = $('a[href$="/items"]').next().clone(), 
 
    centersList = $('li', researchCenters), 
 
    centers = centersList.slice(0); 
 

 

 
var research = $('#footer .research-centers-menu .research').append('<ul class="menu" />'); 
 

 
$(research).append(centers);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li> 
 
    <a href="aim/items"></a> 
 
    <ul> 
 
     <li>item one</li> 
 
     <li>item two</li> 
 
    </ul> 
 
    </li> 
 
</ul> 
 

 
<div id="footer"> 
 
    this is a footer 
 
    <div class="research-centers-menu"> 
 
    <div class="research"> 
 

 
    </div> 
 

 
    </div> 
 
</div>

Answer 1

您的附加問題的原因是因爲append()回到原來的元素，而不是附加的元素。

爲了使您的代碼正常工作，您可以反轉邏輯，以便創建新的ul，然後使用appendTo()。這將保留附加li所需的參考。試試這個：

var researchCenters = $('a[href$="/items"]').next().clone(), 
 
    centersList = $('li', researchCenters); 
 

 
var $research = $('#footer .research-centers-menu .research'); 
 
var $ul = $('<ul class="menu" />').appendTo($research); 
 
$ul.append(centersList);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<ul> 
 
    <li> 
 
    <a href="aim/items"></a> 
 
    <ul> 
 
     <li>item one</li> 
 
     <li>item two</li> 
 
    </ul> 
 
    </li> 
 
</ul> 
 

 
<div id="footer"> 
 
    this is a footer 
 
    <div class="research-centers-menu"> 
 
    <div class="research"></div> 
 
    </div> 
 
</div>

Answer 2

嘗試添加這樣。

var researchCenters = $('a[href$="/items"]').next().clone(), 
    centersList = $('li', researchCenters), 
    centers = centersList.slice(0); 


var research = $('#footer .research-centers-menu .research') 
var ul =$('<ul class="menu" />').append(centers); 
research.append(ul);