如何用jquery获得每个ul下最后一个li

代码如下<ul><li>John</li><li>Karl</li><li>Brandon</li></ul><ul><li>Glen</li><li>Tane</li>... 代码如下
<ul>
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
<ul>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
<li>Ralph</li>
</ul>
<ul>
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
展开
 我来答
learneroner
高粉答主

推荐于2016-04-10 · 关注我不会让你失望
知道大有可为答主
回答量:1.1万
采纳率:91%
帮助的人:6451万
展开全部

可以使用css选择器 last-child 实现:

$("ul li:last-child");    // 指定属于父元素ul的最后一个子元素li

示例代码如下

  1. 创建Html元素

    <div class="box">
    <span>点击按钮获取每个ul下的最后一个元素:</span><br>
    <div class="content">
    <ul>
      <li>John</li>
      <li>Karl</li>
      <li>Brandon</li>
    </ul>
    <ul>
      <li>Glen</li>
      <li>Tane</li>
      <li>Ralph</li>
      <li>Ralph</li>
    </ul>
    <ul>
      <li>John</li>
      <li>Karl</li>
      <li>Brandon</li>
    </ul>
    </div>
    <input type="button" value="获取每个ul下的最后一个元素">
    </div>
  2. 设置css样式

    div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
    div.box span{color:#999;font-style:italic;}
    div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
    input[type='button']{height:30px;margin:10px;padding:5px 10px;}
    ul{padding:5px 25px;border:2px dashed #cc6699;}
    .red{color:red;}
  3. 编写jquery代码

    $(function(){
    $(":button").click(function() {
    $("ul li:last-child").addClass('red');          // 设置样式
    str = $("ul li:last-child").map(function(){     // 获取最后一个锂元素的内容
    return $(this).text();
    }).get().join(',');
    alert(str)
    });
    })
  4. 观察效果

  • 初始状态

  • 点击按钮后效果

四舍五不入6
高粉答主

2020-04-15 · 醉心答题,欢迎关注
知道答主
回答量:147
采纳率:100%
帮助的人:2.1万
展开全部

用jquery获得每个ul下最后一个li可以参考下面的代码:

$(function(){

$("ul").each(function(){

var y = $(this).children().last();

alert(y.text());

});

});

扩展资料:

JQuery函数

$(“img”).attr(“title”, function() { return this.src }); 给某个元素添加属性/值 

$(“元素名称”).html(); 获得该元素内的内容(元素,文本等) 

$(“元素名称”).html(“new stuff“); 给某元素设置内容 

$(“元素名称”).removeAttr(“属性名称”); 给某元素删除指定的属性以及该属性的值 

$(“元素名称”).removeClass(“class”); 给某元素删除指定的样式 

参考资料来源:百度百科-jQuery

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
苏州欧进地坪厂
推荐于2018-02-27 · TA获得超过478个赞
知道小有建树答主
回答量:854
采纳率:80%
帮助的人:263万
展开全部
$(function(){
$("ul").each(function(){
var y = $(this).children().last();
alert(y.text());
});
});
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
efine_cn
2013-04-14
知道答主
回答量:5
采纳率:0%
帮助的人:3.3万
展开全部
$("ul > li:last-child").css("color", "red");
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2013-04-14
展开全部
$("ul > li:last-child")
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式