如何在"视图"生成的列表中的最后一个上添加"最后"类?
时间:2020-03-06 14:31:42 来源:igfitidea点击:
如何在"视图"生成的列表中的最后一个" <li>"上添加"最后一个"类?
解决方案
我们可以在li元素上使用last-child伪类来实现此目的
<html>
<head>
<style type="text/css">
ul li:last-child
{
font-weight:bold
}
</style>
</head>
<body>
<ul>
<li>IE</li>
<li>Firefox</li>
<li>Safari</li>
</ul>
</body>
</html>
还可以使用第一个孩子的伪类。
我不确定last-child元素是否可以在IE中使用。
jQuery是否与drupal捆绑在一起,如果可以,则可以使用
$('ul>li:last').addClass('last');
为了达成这个
另外,如果某些浏览器不支持last-child类,则可以通过JavaScript来实现。例如,此脚本可以为所有" ul"标签中的最后一个" li"元素设置类名,尽管它可以轻松地适用于其他标签或者特定元素。
function highlightLastLI()
{
var liList, ulTag, liTag;
var ulList = document.getElementsByTagName("ul");
for (var i = 0; i < ulList.length; i++)
{
ulTag = ulList[i];
liList = ulTag.getElementsByTagName("li");
liTag = liList[liList.length - 1];
liTag.className = "lastchild";
}
}

