推荐::::方法一,使用: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>