Question

我在html中有以下结构（由于发布问题时的格式问题，我没有在ul和li之前编写初始标记）

<ul>
    <li id="list0">xyz
        <ul>
            <li id="list1">abc</li>
            <li id="list2">abc</li>
            <li id="list3">abc</li>
        </ul>
    </li>
</ul>

现在假设我只能将id作为list2传递给函数，并且函数会执行一些ajax并给出响应li id =“list4”＆gt; abc

我想在ul中添加这个新添加的孩子，其中li为id“list2”。什么是我试过的选择但失败

function selectUl(id){
   $("#list"+id+"").parent().append('li id="list4">abc</li');  //inserts new list in parent ul 
   $("#list"+id+"").append('li id="list4">abc</li'); //inserts new list after current ul
   $('li id="list4">abc</li').insertAfter("#list"+id+""); //inserts new list after current ul
}

现在想在当前ul中插入新列表告诉我现在这样做，前提是我只能在ul中传递list的id。

Answer 1

我有点不确定你想在这里实现什么。

你得到一个ajax响应，ajax响应有一个ID吗？或者它是否包含您要追加的实际HTML？

你是否只想在当前LI之后添加一个id为“list3”的新LI？或者您是否想要添加新的“外部”LI以创建新的UL列表？

更新：

您不需要使用“insertAfter”，只需将其附加到UL即可。像这样：

var list = document.getElementById("list0").getElementsByTagName("UL")[0]; // Chooses the first UL contained in the list0 LI
var newLI = document.createElement("LI");
newLI.id = "list4";
newLI.innerHTML = "abc";
list.appendChild(newLI);

所以只需将有争议的ID放在适合此代码的位置即可。希望有所帮助： - ）

Answer 2

  $('#list2').after('<li>foo</li>');

或者在你的情景中：

function selectUl(id){
   $("#list"+id+"").after('<li id="list4">abc</li>');
}

Example on jsFiddle

Answer 3

$('<li id="list2">def</li>').insertAfter($(document).find("ul #list2"));

在当前UL中附加ID为LI的数据

3 个答案: