2016-10-26 4 views
0

안녕 얘들 아 앵커 요소를 반환 할 의도가 있지만 일부 문제가 있습니다.내 함수 원하는 결과를 생성하지 않습니다.

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 요소 인 부모 요소를 반복하는 것입니다. 결과를 앵커로 설정합니다. 내 함수가 앵커 태그를 반환하는지 확인하기 위해 anchor가 a 태그와 같으면 if 문을 사용하여 함수 shoukd가 반환하는지 확인합니다. 나는 jQuery 준비 함수가 순수하게 DOM을 준비하는 것입니다 자바 스크립트를 사용하고자합니다. 친구들, 제가 옳은 일을하고 있습니까?

+0

else 절에서 myDiv [i]를 반환하지 마십시오. – Phylogenesis

+1

'$ ('. div1 a')'는 div1 안에있는 모든 앵커를 반환합니다 ... 당신이 찾고있는 것이거나 내가 당신의 질문을 오해 했습니까? 덕분에 – LinkinTED

+0

. 하지만 실제로 나무를 가로 지르고 싶습니다. 그래서 div의 모든 자식을 반복하는 함수를 사용했습니다. 반복문에서 앵커 태그가 발견되었는지 확인하기 위해 if 문을 사용했습니다. 그래서 함수를 반환하고 아무것도하지 싶습니다. 앵커가 발견 된 경우 – pedroyanky

답변

1

이미 jQuery를 사용하고 있으므로 앵커를 선택하는 데 사용하지 마십시오.

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

myAnchor[0]은 (jQuery 객체 대신) dom 요소를 제공합니다. jQuery를 사용하여

1

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>

1

, 그것은 죽은 쉽게 :

<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> 

당신이 자바 스크립트로 무엇을하고있는 f를, jQuery를 사용하면 시간의 톤을 저장하고 배울 수있는 노력을 투자 가치가있다 잘. 가능한지 소개하려면 http://api.jquery.com/browser/으로 시작하십시오.

+1

이 솔루션이 작동하면 투표하십시오. –

+0

네,하지만 저는 자바 스크립트로 얼마나 멀리 할 수 ​​있는지보고 싶었습니다. – pedroyanky

관련 문제