在javascript中选择最后一个孩子

时间:2012-11-09 13:21:58

标签: javascript

我有一个无序列表的句柄(对于我的例子,我将调用句柄Var1),并希望能够将其最后一个li分配给一个变量。我尝试了Lastli = var1.lastChild唯一可行的方法,但事实并非如此。我似乎无法使用Javascript而不是jQuery找到答案,任何帮助都表示赞赏。

5 个答案:

答案 0 :(得分:14)

您可以选择父元素并使用lastChild属性。

var container = document.getElementsByTagName("ul")[0];
var lastchild = container.lastChild;

或者您将所有项目选择到一个数组中并获取最后一项。这是一个简单的例子:

 var items = document.querySelectorAll("li");
 var lastchild = items[items.length-1];

答案 1 :(得分:6)

你可以选择所有'li'并选择最后一个。类似的东西:

var myLi = document.getElementsByTagName('li');
var lastLi = myLi[myLi.length-1];

答案 2 :(得分:2)

试试这个:.childNodes[childNodes.length - 1]

答案 3 :(得分:1)

ulReference.children[ulReference.children.length -1]ulReference.childNodes[ulReference.childNodes.length -1]。可以找到两者之间的差异here

答案 4 :(得分:0)

让我们考虑一个例子

<ul >
    <li>Coffee</li>
    <li>Tea</li>
    <li>Milk</li>
</ul>

要获取列表的最后一个子代,您只需使用queryselector

document.querySelector('li:last-child'); //this will return Milk which is the last child of the list
document.querySelector('li:first-child') OR document.querySelector('li'); //both will give you the first child of the list

假设您想要第n个孩子,可以使用以下语法:

document.querySelector('li:nth-child(2)');  //it will return the second child (here Tea)

如果要给定列表中的所有列表项:

document.getElementsByTagName('li') //(Will return the whole list)here i am using tagname. It can be also applied on classname or element id