2013-04-09 3 views
0

이것은 shan이고 저는 javascript 멍청이이고 여기서는 예제로 qa 코드를 사용하려고합니다. div 요소에 작은 자바 스크립트 콘텐츠를로드하려고하지만 위의 코드는 도움이되지 않습니다.div를 사용하여 div에 내용을로드 할 수 없습니다.

<html> 
<head> 
    <title> 
    using d for statement 
</title> 
<script> 
    function displaytext() { 
    var loopindex=0; 
    var sum=0; 
    for (var loopindex=1; loopindex <=100; loopindex++) { 
     sum +=loopindex; 
    }; 
    document.getElementById('targetdiv').innerhtml="adding 1 to 100 gives "+sum; 
    } 
</script> 
</head> 
<body> 
    <div id="targetdiv"> 

    </div> 
</body> 
</html> 
+0

여기서 'displaytext()'는 (는) 어디에 호출됩니까? 'document.onload()'호출로 그것을 감쌀 수도있다. – Schleis

+0

은 'innerHTML'에서'innerhtml'을 변경합니다. @Schleis가 제안한대로'displaytext()'함수를 호출하십시오. – Ragnarokkr

답변

1

이 기능을 호출해야합니다. 그것은 윈도우가로드 될 때까지 기다리는 것도 좋은 생각 (또는 detect the DOM ready state에 좀 더 진보 된 JS를 사용할 수 있습니다.) :

<html> 
<head> 
    <title> 
    using d for statement 
</title> 
<script> 
    function displaytext() { 
    var loopindex=0; 
    var sum=0; 
    for (var loopindex=1; loopindex <=100; loopindex++) { 
     sum +=loopindex; 
    }; 
    document.getElementById('targetdiv').innerHTML = "adding 1 to 100 gives "+sum; 
    } 
    window.onload = function(){ 
     displaytext(); 
    } 
</script> 
</head> 
<body> 
    <div id="targetdiv"> 

    </div> 
</body> 
</html> 
+1

과 JS의 속성은 대소 문자를 구별하므로'innerhtml'이 아닌'innerHTML'이됩니다. – outcoldman

+0

@outcoldman 멋지게 잡았습니다. 결정된. –

+0

여전히 결과가 브라우저에로드되지 않습니다. – jackal4me

0

3 문제 :

  1. 당신은 실제로 함수를 호출하지 않습니다. 선언 된 것뿐입니다.
  2. 속성은 innerHTML이 아닌 innerHTML입니다. Javascript는 대소 문자를 구분합니다.
  3. 스크립트가 참조 대상 요소 위에 있습니다. 스크립트가 발견되면 실행되므로 (페이지 구성은 실행 중에 일시 중지됨) 참조하는 요소는 절대로 발견되지 않습니다.

또한 loopindex 변수를 두 번 선언합니다. ES5 strict에서 구문 오류가 발생할 것으로 생각됩니다.

<html> 
    <head> 
     <title> 
     using d for statement 
     </title> 
    </head> 
    <body> 
     <div id="targetdiv"> 

     </div> 
    </body> 
    <script> 
     function displaytext() { 
     var sum=0; 
     for (var loopindex=1; loopindex <=100; loopindex++) { 
      sum +=loopindex; 
     }; 
     document.getElementById('targetdiv').innerHTML="adding 1 to 100 gives "+sum; 
     } 
     displaytext(); 
    </script> 
</html> 
관련 문제