2012-05-14 4 views
2

공백 문자는 DOM에서 빈 텍스트 요소로 계산됩니다. 어떻게 공백을 계산할 수 있습니까? 본체 내부의 요소, 예를 들면공백을 자식 노드로 계산하는 방법은 무엇입니까?

<body> 

    <div> 

    </div> 

    <div> 

    </div> 

</body> 

얼마나 많은 공백 (childNodes에)?

각 div 요소 내에 몇 개의 공백 (childNodes)이 있습니까?

+0

왜 우리에게 말해 줄 수 있습니까? – Starx

+0

왜냐하면 내가 그 몸 안의 자식 노드의 수를 알지 못한다면 예를 들어 body 요소 내부의 요소에 접근 할 수 있기 때문입니다. innerHTML을 사용하고 싶지 않습니다. – user1394479

+0

내 대답은 업데이 트를 참조하십시오 – Starx

답변

0

얼마나 많은 요소가 비어 있는지 확인하려는 경우? 그런 다음 jQuery 솔루션을 대신 제공합니다.

bodyChild = $("body :empty").length; 
divHcild = $("#divid :empty").length; 

요소를 사용하면 요소 내에서 완전히 많은 요소가 무엇인지 알 수 있습니다.


업데이트 : 모든 자식 요소를 얻으려면, 당신이

바디 같은 것을 사용할 수 있습니다 : 당신이 게시

var children = document.getElementByTagName('body').childNodes; 
+0

코드를 보면서 그냥하지 않고 얼마나 많은 childnodes를 세는 방법에 대해 ?? – user1394479

+0

@ user1394479, 그게 당신이 그 요소에 액세스하는 방법입니다. '길이'와 아마도'for 루프'사용하기 – Starx

+0

나의 원래 질문 .. 어떻게 그 공백에 대해 ??? 나는 그들이 childNodes 인 것을 역시 읽었다, 나는 그들을 세는 알고 싶다. – user1394479

1

코드는 5 공백이있다. 왜 그런지 설명해 드리겠습니다. 먼저 화이트 스페이스를 참조 할 때 나는 " " char에 대해서만 말하는 것이 아니라는 것을 분명히 밝힙니다. 공백은 Text 노드를 나타내는 \t, \r 또는 \n 문자 일 수도 있습니다. 당신이 알 수 있듯이, \n\t 같은 텍스트 노드에

body 
| 
x-- #Text = "\n\t" 
| 
x-- div 
| | 
| x-- #Text = "\n\t" 
| 
x-- #Text = "\n\t" 
| 
x-- div 
| | 
| x-- #Text = "\n\t" 
| 
x-- #Text = "\n" 

있습니다 : 그와
우리는 당신이 게시 코드가 DOM에 표시되는 방법에 대해 이야기 할 수 말했다. 이것은 DOM 레벨 2에 부합되는 것은 말한다 : 문서가 먼저 DOM을 통해 사용할 수 있습니다

는, 텍스트의 각 블록에 대해 하나의 텍스트 노드가있다.

따라서 div을 누르는 줄 바꿈은 오른쪽 텍스트를 누르는 탭과 동일한 텍스트 노드에 있습니다. 우리는 더 가서 div들 중 하나에 텍스트를 추가 할 수 있습니다 같은 브라우저에 의해 해석 될 수

<body> 

    <div> 

    </div> 

    <div> 
     Hello World! 
    </div> 

</body> 

:

body 
| 
x-- #Text = "\n\t" 
| 
x-- div 
| | 
| x-- #Text = "\n\t" 
| 
x-- #Text = "\n\t" 
| 
x-- div 
| | 
| x-- #Text = "\n\t Hello World! \n\t" 
| 
x-- #Text = "\n" 

이 텍스트는 두 공백 노드로 그룹화됩니다, 모든 것이 텍스트이기 때문에 단일 텍스트 블록이됩니다. 이것은 문서에서 공백을 계산하는 방법입니다.
하지만 내 눈에 의존하지 않고 공백을 계산하여 요소를 찾거나 액세스하려고합니다. 대신 어떤 스크립트를 사용하여 childNodes을 반복하고 nodeTypeelement인지 확인하십시오.

Here 공백을 걱정하지 않고 DOM을 가로 지르는 데 유용한 몇 가지 기능이 있습니다.

단어가 충분합니다. 몇 가지 코드를 살펴 보겠습니다. 게시 한 HTML에 5 개의 공백이 있음을 증명하려면 문서의 모든 텍스트 노드를 계산하는이 작업 example을 참조하십시오.

뭔가 명확히하는 데 도움이되기를 바랍니다.

관련 문제