Question

我需要获取父div中<p>标记的文本，而不是来自子div。我已经尝试了以下代码，它获取了父div和子div中的所有文本。

注意：我需要获取文本parent p1和parent p2 only

Downvoters plz提到原因，以便我将来不会犯这个错误

HTML



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <p>parent p1</p>
    <p>parent p2</p>
    <div id="sub">
    <p>child div</p>
    <button type ="button">click</button>
    </div>
    </div>


    <script type="text/javascript">
        $(document).ready(function(){
        $("button").click(function(){
    
              var a = $(this).parent("div").attr("id");
                
                console.log($("#"+a).parent("div").text());
    
    
                });
    });
    </script>

Answer 1

你可以这样尝试

 $("button").click(function(){
                    alert($(this).parent('div').parent('div').children('p').text())
         })

<div>
    <p>parent p1</p>
    <p>parent p2</p>
    <div id="sub">
    <p>child div</p>
    <button type ="button">click</button>
    </div>
    </div><script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

Answer 2

这正常工作

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <p>parent p1</p>
    <p>parent p2</p>
    <div id="sub">
        <p>child div</p>
         <button type ="button">click</button>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){
        $("button").click(function(){
           var text = $(this).parent("div").parent().children('p').text();
           console.log(text);
        });
    });
</script>

＆＃13;

Answer 3

它不是一个孩子，它是按钮的兄弟姐妹。

$("button").click(function(){
   console.log($(this).closest('div').parent().children('p').text()): // parent p1, parent p2
});

否则你需要迭代p标签并推入数组并加入它。

Answer 4

因此，问题是要回溯父p1和p2文本，解决方法是：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <p>parent p1</p>
  <p>parent p2</p>
  <div id="sub">
    <p>child div</p>
    <button type="button">click</button>
  </div>
</div>


<script type="text/javascript">
  $(document).ready(function() {
    $("button").click(function() {

      $(this).parents("div:not(#sub)").find(">p").each(function(index,value){
        console.log("p " + (index+1) + " = " + $(this).text());
      });
    });
  });
</script>

＆＃13;

请注意，有很多方法。

首先，您可以在

中找到所需的p

var p = $(this).parents("div:not(#sub)").children("p");

和

var p = $(this).parents("div:not(#sub)").find(">p");

其次，如果你想为每个p进行迭代，你可以像在anwser中那样制作每个cicle

p.each(function(){
    console.log($(this).text());
})

否则您可以使用

获取全文

p.text()

Answer 5

我希望下面的内容能够正常运行

$("#" + a).parent("div").clone().children().remove('#'+ a).text();

Answer 6

这适合你，希望它有所帮助。

parent().parent().children('p').text();

或

console.log($(this).parent().siblings('p').text())

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <p>parent p1</p>
    <p>parent p2</p>
    <div id="sub">
    <p>child div</p>
    <button type ="button">click</button>
    </div>
    </div>


    <script type="text/javascript">
        $(document).ready(function(){
          $("button").click(function(){
           console.log($(this).parent().parent().children('p').text())
console.log($(this).parent().siblings('p').text())
     })
    });
    </script>

＆＃13;

jquery如何使用chlid获取父文本？

6 个答案: