使用jQuery获取最近的class为the_text的元素文本为空如何解决

问题原因 #

jQuery的closest()方法只会沿DOM树向上遍历当前元素的祖先节点，你代码中的.the_text不属于点击元素.click-class的祖先链，因此匹配不到任何元素，调用text()返回空值。

修复方案 #

先定位到两个元素共同的最近父容器，再在父容器范围内查找目标.the_text元素即可，修改后的代码如下：

$(document).on('click', '.click-class', function(e) {
  var t = $(this);
  alert(t.closest('div').find('.the_text').text());
});

如果你的DOM结构相对固定，也可以通过父级兄弟节点匹配：

$(document).on('click', '.click-class', function(e) {
  var t = $(this);
  alert(t.parent().siblings('.the_text').text());
});

内容的提问来源于stack exchange，提问作者Cary