Question

我有这个HTML结构

<div class="parent_wrapper">
    <div class="child_element_one">
    </div>
    <div class="child_element_two">
        <p></p>
    </div>
    <div class="child_element_three">
        <a href="#">Click to test</a>
    </div>

以及我尝试使用它的脚本（到目前为止我的尝试）

$('.child_element_three a').click(function(e){
    $(this).parents('parent_wrapper').find('.child_element_two p').text("added to the div that has a class of child_element_two paragraph");
});

问题：添加到具有class_element_two段的所有div中，我想要的只是将文本添加到具有当前触发链接的同一组的.child_element_two段或点击链接的当前组。怎么做？

Answer 1

您在parent_wrapper中缺少类选择器，您已将其用作元素选择器。

同时将.parents()更改为closest()，因为您只想匹配选择器的第一个父

$(this).closest('.parent_wrapper').find('.child_element_two p').text("added to the div that has a class of child_element_two paragraph");

演示：Fiddle

Answer 2

我认为您可以在此任务中使用.siblings：

$('.child_element_three a').click(function (e) {
     $(this).parent().siblings('.child_element_two').find('p').text("added to the div that has a class of child_element_two paragraph");
});

DEMO：https://jsfiddle.net/udzdnh11/2/

Answer 3

 $('.child_element_three a').click(function(e){
     $(this).parents('.parent_wrapper').find('.child_element_two p').text("added to    the div that has a class of child_element_two paragraph");
 });

你错过了.中的parents('.parent_wrapper')。

Answer 4

你可以尝试：

$('.child_element_three a').click(function(e){
    $(this).parent().find('.child_element_two p').text("added to the div that has a class of child_element_two paragraph");
});

获取指定的父元素，然后找到指定的子元素

4 个答案: