Javascript 获取位于另一个元素之上的元素内部的文本

Javascript 获取位于另一个元素之上的元素内部的文本,javascript,jquery,html,traversal,Javascript,Jquery,Html,Traversal,下面的代码呈现了一个包含一些信息的框。我需要获得按钮上方一些div的文本,用户将单击该按钮以获取信息。我不能使用ID,因为页面的其余部分将一次又一次地使用相同的代码和不同的文本 <div class="tab-content" id="myTabContent"> <div class="tab-pane fade" id="dummy" role="tabpanel" aria-labelledby="tab"> <div class="bg-li

下面的代码呈现了一个包含一些信息的框。我需要获得按钮上方一些div的文本,用户将单击该按钮以获取信息。我不能使用ID,因为页面的其余部分将一次又一次地使用相同的代码和不同的文本

<div class="tab-content" id="myTabContent">
    <div class="tab-pane fade" id="dummy" role="tabpanel" aria-labelledby="tab">
    <div class="bg-light px-3 my-2">                          
        <div class="row align-items-center text-center">
        <div class="col-6 col-sm-4 col-lg-1 my-2">
            <span class="display-4 ws_day"><strong>04</strong></span>
            <br>
            <span class="ws_month"><strong>Jan</strong></span>
        </div>
        <div class="col-6 col-sm-4 col-lg-1 my-2">
            <img src="" />
        </div>
        <div class="col-12 col-sm-4 col-lg-2 my-2">
            <span><strong>Lorem</strong></span>
            <br>
            <span class="ws_time">6pm</span>
            <br>
            <span class="ws_timezone">(GTM+12:00)</span>
        </div>
        <div class="col-12 col-lg-4 my-2">
            <span class="h5 ws_title"><strong>Title</strong></span>
        </div>
        <div class="col-6 col-lg-2 my-2">
            <span><strong>Ipsum</strong></span>
            <br>
            <span><strong>Ipsium</strong></span>
        </div>
        <div class="col-6 col-lg-2 my-2">
            <a class="dec-none" role="button">
                <button class="btn btn-orange buttonClick" style="white-space: normal" data-toggle="modal" data-target="#modal">Button</button>
            </a>
        </div>
        </div>                          
    </div>
    </div>
</div>
我使用jQuery文档尝试了多种组合,但没有成功


甚至可以实现我所需要的吗?

除了JS中额外的
导致语法错误之外,问题是由于
最近('div span')
。您需要为
closest()
指定一个选择器,该选择器是两个元素的最近父元素。同样地,
最近('.row')
将起作用,考虑到示例中的HTML

还要注意,不能在HTML中嵌套可单击元素,因为它是无效的。因此,我移除了包裹
按钮的
a

$(“.buttonClick”)。单击(“单击”,函数(){
var title=$(this).closest(“.row”).find(“.ws_title”).text();
控制台日志(标题);
});

标题
按钮

我明白了,除了在.pane选项卡中有多个元素具有相同的类外,这将起作用。。。我需要的是在按钮上方找到与类givenTry
.row
匹配的第一个元素。如果失败,则需要添加另一个包含每个组和目标的元素。bg-light不是用于设置背景样式的类?它可能是,但您仍然可以通过JS使用它来选择元素。不过我觉得
.row
会更好。我明白了,我明白了。。。谢谢。。。我现在就试试看,如果行得通,我会接受你的回答:)
$(".buttonClick").on("click", function(){
    var title = $(this).closest("div span").find(".ws_title").text());          
 });