Question

我无法找到获取div的最后一个子节点的href值的方法。基本上，布局是这样的：

<div id="slider">
    <div id="slide1" class="slides">
       <a href="items/show/1" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide2" class="slides">
       <a href="items/show/2" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide3" class="slides">
       <a href="items/show/3" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide4" class="slides">
       <a href="items/show/4" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide5" class="slides"> 
       <a href="items/show/5" class="link"> <-- trying to get this href value
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
</div>

我正在尝试获取“.link”的最后一个兄弟的href值，但我不能。指出我在哪里做错了？到目前为止，这是我的jQuery代码：

$(document).ready(function(){

var latestUrl = $(".link").siblings(":last").attr("href");
console.log(latestUrl);
 });

但控制台返回：“undefined”

[更新]我找到了解决方案：我需要等到页面加载所有内容，然后才能查找最后一个子项的href属性。这个例子是一个图像库，所以加载需要相当长的时间，可能在页面加载后一秒钟。所以这里是为jQuery脚本设置延迟的代码：

<script type="text/javascript">
window.setTimeout(function(){
alert($('.link:last').attr("href"));
}, 3000);
</script>

这设置了3秒的延迟。谢谢你的回答！

Answer 1

您需要选择最后一个.slides元素。你可以使用：

Example Here

var latestUrl = $('#slider .slides:last').find('a').attr("href");
console.log(latestUrl);

或者，这也可以：

Example Here

var latestUrl = $('a', '#slider .slides:last').attr("href");
console.log(latestUrl);

虽然根据您提供的HTML使用$('.link:last').attr('href')可能会有效，但如果.link元素之外有#slider个元素，那么它就不会起作用。此外，它并不保证它将在最后.slides元素中。

Answer 2

应该像$('.link:last').attr('href')

一样简单

＆＃13;

alert($('.link:last').attr('href'))

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="slider">
    <div id="slide1" class="slides">
       <a href="items/show/1" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide2" class="slides">
       <a href="items/show/2" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide3" class="slides">
       <a href="items/show/3" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide4" class="slides">
       <a href="items/show/4" class="link">
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
    <div id="slide5" class="slides"> 
       <a href="items/show/5" class="link"> <-- trying to get this href value
           <h2>Date</h2>
           <h3>Title</h3>
       </a>
</div>

＆＃13;

在深层嵌套的库中获取href值

2 个答案: