使用 JQuery 获取 <h3> 内容

Question

多年来我一直致力于将文本放入 H3 标签中，所以我想我应该问问社区。我正在使用 JQuery 来获取它，但是当运行代码时我没有返回任何内容。

可能展示我想要的效果会更好：

<a href="/eat-move-sleep/" class="teaserBoxLink _matchHeight">
  <div class="teaserBoxImage">
   <img src="/contentassets/6a53309d70054d14b988a9a45ab1c760/e43ee1c1d8ad4461802fde8ea7939a962.jpg?width=500&amp;height=200&amp;quality=90&amp;mode=crop" alt="" />
  </div>
  <h3 class="teaserBoxTitle">EAT MOVE SLEEP</h3>
</a>

我想从 H3 标签（文本 "EAT MOVE SLEEP"）中获取内容作为输出。

这是我尝试过的多种方法之一的片段：

function(){
var ec = {{Click Element}};
var h3 = $(ec).siblings().find('h3').attr('class');
return h3;
}

感谢您的帮助！ :)

Answer 1

试试这个：

var content = $("a.teaserBoxLink._matchHeight h3").text();

我认为应该可以通过这种方式访问它，但是您在 link (a) 中设置 H3 可能存在问题。

Answer 2

图像没有任何兄弟图像，$(ec).siblings() 返回一个空集，因此 .find("h3") 没有找到任何东西。 <h3> 是图像父级 <div> 的同级图像，因此它应该是：

var h3 = $(ec).parent().siblings("h3").text();

或者您可以减少它对特定布局的依赖：

var h3 = $(ec).closest(".teaserBoxLink").find("h3").text();

使用 JQuery 获取 <h3> 内容

Using JQuery to get <h3> contents

javascript

jquery

google-tag-manager