jqueryの子要素の内部HTMLを選択

Question

クリックした要素の子ノードの値を取得するためにJQUERYを使用しようとしています。私はこれを研究しており、うまくいくと思われる答えを見つけていません。私は、「これは私が望むものである」と言うテキストを取得しようとしています

私のHTMLは、私のjQueryの

$("div").click(function(){ 

var a = jQuery(this).children('.g > a').html; 
     console.log(a); 
}); 

次のようになり

<div class="a"> 
    <article class="b"> 
     <section class="c"> 
      <div class="d"> 
       <a class="e" href="https://"><img src="https:/"></a> 
        <div class="f"><div class="g"> 
         <a href="https:" >this is what i want</a> 

次のようになり、私もしました私はあなたがCLIされ divとより具体的にする必要がありだと思う

$("div").click(function(){ 

var a = jQuery(this).find('.g > a').html; 
     console.log(a); 
}); 

Answer 1

>セレクタは、直接の子ではないとされ、唯一の直接の子供たちのためです。 2番目の例では.html()がありません。

$("div.a").click(function(){ 
 
    var a = jQuery(this).find('.f a').html(); 
 
    console.log(a); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="a"> 
 
    <article class="b"> 
 
     <section class="c"> 
 
      <div class="d"> 
 
       <a class="e" href="https://"><img src="https:/"></a> 
 
        <div class="f"><div class="g"> 
 
         <a href="https:" >this is what i want</a>

Answer 2

を試してみましたclassNameで呼び出してckedします。

$(".a").click(function(e){ 
 
    var a = $(this).find(".f").children("a"); 
 
    console.log($(a).text()); 
 
});

.a{ 
 
    border:1px solid black; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="a"> 
 
    <article class="b"> 
 
     <section class="c"> 
 
      <div class="d"> 
 
       <a class="e" href="https://"><img src="https:/"></a> 
 
       <div class="f"><div class="g"></div> 
 
         <a href="https:" >this is what i want</a> 
 
         </div> 
 
       </div> 
 
       </section> 
 
       </article> 
 
       </div><!--end a-->