如何使用jquery动态加载菜单栏和子菜单

Question

如何使用jQuery动态加载菜单栏和子菜单？

我的代码是：

$(document).ready(function() { 
$("#ulSub").append('<li id="abc"><h5>Cancer information</h5><ul id="ulSub1">');  var ciid = $("#ulSub li").find("ul").attr("id"); 
$(ciid).append('<li><h5>What is cancer</h5></li></ul></li>'); }); 

<div class="dmenu"> <ul id="ulSub"> </ul> </div> 

这是为什么不追加？

Answer 1

删除.attr("id")它会工作。

在做$(ciid)时，jQuery预计ciid是一个jQuery对象。

工作代码段：

$(document).ready(function() { 
 
    $("#ulSub").append('<li id="abc"><h5>Cancer information</h5><ul id="ulSub1">');  
 
    var ciid = $("#ulSub li").find("ul"); // get jQuery object 
 
    $(ciid).append('<li><h5>What is cancer</h5></li></ul></li>'); 
 
});

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

 
<div class="dmenu"> <ul id="ulSub"> </ul> </div>