Javascript DOM howto?

Question

나는 자바 스크립트 멍청한 놈입니다.

div.box의 두 번째 'p'요소를 선택하고 싶습니다. 어떻게해야합니까?

고맙습니다. 톰

Answer 1

을 jQuery를 사용하지 않고, 기본적인 방법은 DOM 요소에 고유 ID를 연결하는 것입니다() 메소드에서 getElementById를 통해 액세스 할

<p id="second_p_elmt"> [...] </p> 

다음 :

<script ...> 
    var second_p_elmt = document.getElementById('second_p_elmt'); 
</script> 

Answer 2

으로 클래스 상자에 div의 두 번째 p 요소를 얻으려면 다음을 입력하십시오.

var paragraph = null; 
var divs = document.findElementsByTagName('div'); 
for (var i = 0; i < divs.length; i++) { 
    var div = divs[i]; 
    if (div.class == 'box') { 
     var paragraphs = div.getElementsByTagName('p'); 
     if (paragraphs.length > 1) 
      paragraph = paragraphs[1]; 
     break; 
    } 
} 

문단은 paragraph 변수에 있습니다 (발견되지 않으면 null). 당신이 그런 jQuery으로 도서관이 훨씬 쉽게 할 수 그러나

:

var paragraph = $('div.box p:eq(1)'); 

Answer 3

<script type="text/javascript"> 
    var boxElem = document.getElementById('box'), 
     pElems = boxElem.getElementsByTagName('p'), 
     whatYouWant = pElems[1]; // [1] is the second element in the response from getElementsByTagName 
</script> 

Answer 4

당신은 몇 가지 옵션이 있습니다. 위에서 설명한 것처럼 jQuery 나 프로토 타입과 같은 훌륭한 프레임 워크 중 하나를 사용할 수 있습니다. 또는 <p/>에 ID를 부여하면 document.getElementById()으로 간단하게 사용할 수 있습니다.

그런 다음 reko_t가 지적했듯이 긴 DOM 통과 코드를 작성해야합니다 (JS 프레임 워크를 다른 곳에서 사용하지 않는 경우이 작업에만 사용하는 것이 바람직 함).

var p = document.querySelectorAll("div.box p");