私の関数が目的の結果を生成していません

Question

こんにちは、私はアンカー要素を返す意図で機能がありますが、いくつかの問題があります。 これは私のコードです：

jQuery(document).ready(function() { 
 
        var myDiv = document.querySelector('.div1').childNodes; 
 
        \t var anchor; 
 
\t    myAnchor = (function() { 
 
\t        var i = 0; 
 
\t \t       for (i = 0; i < myDiv.length; i++) { 
 
\t \t       anchor = myDiv[i]; 
 
\t \t \t 
 
\t \t \t      if (anchor.nodeName == 'a') { 
 
\t \t \t      return anchor; 
 
\t \t \t      }else{ 
 
\t \t \t      return myDiv[i]; 
 
\t \t \t      } 
 
\t \t        } 
 
\t 
 
\t      })(); 
 

 
         console.log(myAnchor); 
 
         });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<nav> 
 
\t \t <div class="div1"> 
 
\t \t   <p>This is the first paragraph inside the division</p> 
 
\t \t \t <p>This is the second paragragh inside the division</p> 
 
\t \t \t <h5>This is a h5 header</h5> 
 
\t \t  <p>This is a paragraph next to he h5 header</p> 
 
\t \t  <a href="#">justklick</a> 
 
\t \t </div> \t \t  
 
\t \t </nav>

誰かが私は私の目的を達成できる方法を教えてくださいする必要があります。私は実際にdivの祖先としてアンカーにアクセスしたかったのです。

私の質問をより明確にする。私はjQueryが簡単にできることを理解しています。しかし、私の意図は、class = div1のdivである親要素を反復することです。結果をアンカーに設定します。私の関数がアンカータグを返すことを保証するために、アンカーがaタグと等しいかどうかをチェックするif文を使用しました。関数shoukd return。私は、jQueryの準備ができている関数は、純粋にDOMを準備するためのものですjavascriptを使用するつもりです。 さん、私は正しいことをやっていますか？

Answer 1

あなたは既にjQueryを使用しているので、アンカーを選択するためにも使用しないのはなぜですか？

jQuery(document).ready(function() { 
    var myAnchor = jQuery('.div1 a'); 
} 

myAnchor[0]は、（jQueryオブジェクトの代わりに）dom要素を提供します。 jqueryのを使用して

Answer 2

jQuery(document).ready(function() { 
 
    //Thhis function returns a list of A tags in the div 
 
    function myAnchor() { 
 
    return jQuery('.div1 a').toArray() 
 
    } 
 
    console.log(
 
    //Get list 
 
    myAnchor() 
 
); 
 
    console.log(
 
    //Get first A element 
 
    myAnchor()[0] 
 
); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<nav> 
 
    <div class="div1"> 
 
    <p>This is the first paragraph inside the division</p> 
 
    <p>This is the second paragragh inside the division</p> 
 
    <h5>This is a h5 header</h5> 
 
    <p>This is a paragraph next to he h5 header</p> 
 
    <a href="#">justklick</a> 
 
    </div> 
 
</nav>

Answer 3

、それは簡単に死んだ：

<div id="firstDiv"> 
    <a href="someurl.htm" class="foundItem">test</a> 
</div> 
<div id="secondDiv"> 
    <a href="someOtherUrl.htm" class="foundItem">test another one</a> 
</div> 
<!-- and so forth --> 

<script type="text/javascript"> 

$(function(){  
    var item = $("#firstDiv a.foundItem"); 
    alert(item.html()); // Will result in "test" 

    var item2 = $("#secondDiv a.foundItem"); 
    alert(item2.html()); // Will show "test another one" 

)}; 
</script> 

あなたはJavaScriptで何かをやっているfは、jQueryのあなたの時間のトンを保存し、学ぶための努力を投資する価値がありますよく可能なことを紹介するには、http://api.jquery.com/browser/から始めましょう。