如何使用 JQuery 检索具有特定类的 span 元素中的文本，该元素位于单击的对象内

How can I retrieve the text inside a span element having a specific class that is inside a clicked object using JQuery?

本文关键字：元素 于单击 对象 单击 文本 检索 span 何使用 JQuery      更新时间：2023-09-26

我不太喜欢JavaScript''jQuery，我对如何在实现菜单的jQuery脚本中处理以下情况有以下疑问，这里是JSFiddle链接以查看整个运行代码：

https://jsfiddle.net/AndreaNobili/s8wos4n2/

因此，正如您在前面的 JSFiddle 中看到的那样，我有以下情况。

在HTML代码中，我有菜单选项卡，这些选项卡由<li>选项卡实现，如下所示：

<li class="com__nav-item">
    <a href="" class="com__nav-link centered">
        <span class="blue-line animate scaleIn delay-3 menuVoiceTitle">FUNCTION 1</span>
        <span class="white-circle animate scaleIn delay-5"></span>
    </a>
</li>

因此，如您所见，实现菜单项的每个<li>选项卡都包含一个显示菜单项标题的<span>（例如本例中的函数 1）。

所有这些<span>都设置了menuVoiceTitle CSS 类。

好的，当用户单击菜单项时，它将执行JavaScript switchTab()函数，这里我有p变量：

var p = $(this).parent('li');

我认为这是点击链接（或类似内容）<li>的参考。

所以现在我有了表示单击菜单项的 <li> 元素的引用，现在我想检索<span>元素内的文本menuVoiceTitle <li>元素内具有 CSS 类。

如何使用 jQuery 正确实现此行为？

简单地说： 

$('.com__nav-item').click(function(){
   var targettext = $(this).find('span.menuVoiceTitle').text();
   alert(targettext);
});

js小提琴

var p = $(this).parent('li');

此行选择父 li 表示您现在单击的当前"li 标签"。 

targetText = p.find('.menuVoiceTitle').html();

现在，在"var p = $（this）.parent（'li'）;"之后使用这一行，您将需要文本。

注意：-find（） 是一个 jquery 函数，它尝试通过元素内部的选择器（id、类、标签名称）来查找元素。

相关文章：