자바 스크립트, HTML 및 CSS가 작동하지 않는 카운터

누구든지이() 코드를 작동시키는 데 도움을 줄 수 있습니까?자바 스크립트, HTML 및 CSS가 작동하지 않는 카운터

주목 : 나는 증가로 증가하는 카운터를 만들고 싶습니다.

내 HTML :

<body onload="incrementCount(10)"> 
    <div class="main_container" id="id_main_container"> 
     <div class="container_inner" id="display_div_id"> 
     </div> 
    </div> 
</body>

내 JS :

var counter_list = [10,10000,10000]; 
var str_counter_0 = counter_list[0]; 
var str_counter_1 = counter_list[1]; 
var str_counter_2 = counter_list[2]; 
var display_str = ""; 
var display_div = document.getElementById("display_div_id"); 

function incrementCount(current_count){ 
    setInterval(function(){ 
     // clear count 
     while (display_div.hasChildNodes()) { 
      display_div.removeChild(display_div.lastChild); 
     } 
     str_counter_0++; 
     if (str_counter_0 > 99) { 
      str_counter_0 = 0; // reset count 
      str_counter_1++; // increase next count 
     } 
     if(str_counter_1>99999){ 
      str_counter_2++; 
     } 
     display_str = str_counter_2.toString() + str_counter_1.toString() + str_counter_0.toString(); 
     for (var i = 0; i < display_str.length; i++) { 
      var new_span = document.createElement('span'); 
      new_span.className = 'num_tiles'; 
      new_span.innerText = display_str[i]; 
      display_div.appendChild(new_span); 
     } 
    },1000); 
}

출처

2017-12-14 Brian Harris

CSS –

에 대한 jsfiddle 링크를 클릭하십시오. 코드를 어디에 두었습니까? ''에 있습니까? 또는 ''의 끝에? 코드가 DevTools에서 콘솔을 확인하는 것이 좋습니다 –

개발자 콘솔을 살펴 본다면 왜 작동하지 않는지 알 수 있습니다. 오류 메시지가 로그에서 일별로 지워집니다. 개발자 도구를 사용하십시오. – epascarello

<body onload="incrementCount(10)"> 
    <div class="main_container" id="id_main_container"> 
     <div class="container_inner" id="display_div_id"> 
     </div> 
    </div> 
</body> 
<script> 
var counter_list = [10,10000,10000]; 
var str_counter_0 = counter_list[0]; 
var str_counter_1 = counter_list[1]; 
var str_counter_2 = counter_list[2]; 
var display_str = ""; 
var display_div = document.getElementById("display_div_id"); 

function incrementCount(current_count){ 
    setInterval(function(){ 
     // clear count 
     while (display_div.hasChildNodes()) { 
      display_div.removeChild(display_div.lastChild); 
     } 
     str_counter_0++; 
     if (str_counter_0 > 99) { 
      str_counter_0 = 0; // reset count 
      str_counter_1++; // increase next count 
     } 
     if(str_counter_1>99999){ 
      str_counter_2++; 
     } 
     display_str = str_counter_2.toString() + str_counter_1.toString() + 
str_counter_0.toString(); 
     for (var i = 0; i < display_str.length; i++) { 
      var new_span = document.createElement('span'); 
      new_span.className = 'num_tiles'; 
      new_span.innerText = display_str[i]; 
      display_div.appendChild(new_span); 
     } 
    },1000); 
} 
</script>

JSFIDDLE : https://jsfiddle.net/v3jncqac/32/

당신은 온로드 기능을 사용하기 때문에 기능을 찾을 수 없습니다 js는 다른 파일에 있습니다. HTML 위에 스크립트 src를 추가하거나 위와 같이 수행해야합니다.

출처

2017-12-14 18:06:01

완벽한 감사합니다 :) –

자바 스크립트, HTML 및 CSS가 작동하지 않는 카운터

답변

관련 문제