去除最后一个li的样式 鲁中O

推荐::::方法一,使用:first-child    纯css的:first-child伪类就可以胜任此任务,操作很方便,代码量忽略不计。支持IE7+,不支持IE6

:first-child /:last-child伪类向元素的  第一个 / 最后一个  子元素添加样式。  延伸:li:nth-child(2)   第一个元素  IE不支持 https://www.cnblogs.com/guozh/p/10161623.html

ul li{ width:98px; height:146px; padding:5px; float:left; border-left:1px solid #ccc;}
ul li:first-child { border-left:0px solid #ccc;}

方法二:引入了jQuery库,再加一句简单的js代码即可

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>     //引入jQuery库
<script type="text/javascript">
    $(function(){
    $("#test li:last").css("border","none");   //关键函数,注意容器id“#test”要和html代码中一样
    })
    </script>
<ul id="test">
    <li>菜单一</li>
    <li>菜单二</li>
    <li>菜单三</li>
</ul>

方法三:不用引入jQuery库,使用原生js代码实现

<script type="text/javascript">
    window.onload = function urlborder() {
            var listr = document.getElementById("test").getElementsByTagName('li'); //注意容器id“test”要和html代码中一样
            for (var i = 0; i < listr.length; i++) {
                if (i == listr.length - 1) {
                    listr[i].style.borderWidth = "0";
                }
            }
        }
    </script>
原文地址:https://www.cnblogs.com/guozh/p/10161554.html