Question

如何使用jQuery实现这一目标？

<ul>
    <li>Home</li>
    <li>About
        <ul>
            <li>About1</li>
            <li>About1</li>
        </ul>
    </li>
</ul>

我的代码

function createMenuBar(mainMenuList) {

  for(var l = 0; l < mainMenuList.length; l++) {
    var item = mainMenuList[l];

    if(item) {
        var mainItem = $("<li></li>"); 
        var mainItemLink = $("<a></a>", {
            href : item.Url,
            text : item.Title
        });

        mainItem.append(mainItemLink);          
        if(item.SubMenus.length) {
            var subMenu = getSubMenu(item.SubMenus);

            mainItem.append(subMenu);
        }

        $('#masterMenu ul').append(mainItem);
    }
  }
}


function getSubMenu(submenuList){
   var subMenuUl = $("<ul></ul>");

    for(var i = 0 ; i < submenuList.length; i++) {
        var subMenuItem = $("<li></li>");  
        var subMenuItemLink = $("<a></a>", {
          href : submenuList[i].Url,
          text : submenuList[i].Title
        });

        subMenuItem.append(subMenuItemLink);
        subMenuUl.append(subMenuItem);
    }

    return subMenuUl;
}

Answer 1

您可以尝试使用append方法。

$('ul.my-ul li.in-this-li').append('<ul><li></li><li></li></ul>');

Answer 2

以下是有关如何添加作品的详细文档http://api.jquery.com/append/。

我的例子：

＆＃13;

$(function() {
  var ulToApppend = $('.append-ul');
  $('.append-li').append(ulToApppend);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<ul class='main-ul'>
  <li class='append-li'>1 li</li>
  <li>2 li</li>
  <li>3 li</li>
</ul>


<ul class='append-ul'>
  <li>10 li</li>
  <li>20 li</li>
  <li>30 li</li>
</ul>

＆＃13;

使用jQuery在li中附加ul

2 个答案: