jquery - 如何在点击链接之前找到元素？

Question

如果我有这样的代码：

<div class="container">
  <span class="pID">12342123</span>
  <a href="#" class="but">click here</a>
</div>

<div class="container">
  <span class="pID">98765432</span>
  <a href="#" class="but">click here</a>
</div>

<div class="container">
  <span class="pID">2342342</span>
  <a href="#" class="but">click here</a>
</div>

如果单击链接，我该如何做到这一点，转到 pID 并在 a 自己的容器中获取 #？

$('.but').on('click',function(){
   var pID = $(this).parent('pID').text(); ?
});

供您参考，我无法控制将 PID 放入锚中。

Answer 1

你很亲密。该元素是兄弟元素，而不是父元素。

$(this).siblings('.pID').text();

Answer 2

$('.but').on('click',function(){
   var pID = $(this).siblings('.pID').html();
});

关于是否使用 .text() 或 .html() 的一些注意事项：

jQuery: text() 和 html() 有什么区别？

如果用作称为 onClick="doThis(this);" 的可调用函数：

function doThis(el) {
    var pID = $(el).siblings('.pID').html();
}

Answer 3

尝试这个：

$('.but').on('click',function(){
  var pID = this.parentElement.children[0].textContent
});

假设 html 结构没有改变（例如 children[0] 始终是您正在寻找的跨度