在页面中,添加一个<ul>元素,里面放置多个(至少7个以上)的<li>元素,此外,再添加一个<a>元素.
初始时:<ul>元素中仅显示5个<li>元素,其中包含还包括最后一个<li>元素,<a>元素中的显示"更多"字符.
当点击"更多"链接时,自身内容变为"简化",同时,<ul>元素中显示全部的<li>元素.
当点击"简化"链接时,自身内容变为"更多",同时,<ul>元素中仅显示包含最后一个<li>元素在内的5个元素.
<ul> <li>0</li> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> </ul> <a href="#">更多</a> <script> $("li:gt(3):not(:last)").hide(); $("a").click(function(){ var a =$("a").html(); if(a =="更多") { $("a").html("简化"); $("li").show(); return; } $("a").html("更多"); $("li:gt(3):not(:last)").hide(); return; }); </script>
时间: 2024-10-13 16:01:54