자바 스크립트로 스타일 속성을 변경하십시오.

Question

달에 따라 가야할 캘린더 테이블 행이 있습니다.

HTML :

<tr id="bottomrow" class="week" valign="top" style="display:none;"> 
     <td class="day" id="d36"> 
      <div class="daynumb" id="x36"></div> 
     </td> 
     <td class="day" id="d37"> 
      <div class="daynumb" id="x37"></div> 
     </td> 
     <td class="day" id="d38"> 
      <div class="daynumb" id="x38"></div> 
     </td> 
     <td class="day" id="d39"> 
      <div class="daynumb" id="x39"></div> 
     </td> 
     <td class="day" id="d40"> 
      <div class="daynumb" id="x40"></div> 
     </td> 
     <td class="day" id="d41"> 
      <div class="daynumb" id="x41"></div> 
     </td> 
     <td class="day" id="d42"> 
      <div class="daynumb" id="x42"></div> 
     </td> 
    </tr> 

내가 document.getElementByID('bottomrow').style.display = "none";를 사용하여 시도했지만이 작동하지 않는 것 ...

자바 스크립트 :

이

function february() { 

document.getElementById('bottomrow').style.display = "none"; 

var numbdays = 28, 
    offset = 5; 

for (var date = 1; date <= numbdays; date++) { 
    document.getElementById("x" + (date + offset)).innerHTML = date; 
} 
} 

페이지가로드 될 때, 행은 여전히 볼 수 있습니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

Answer 1

DOM이 준비되기 전에 함수가 실행 중입니까? 아직 존재하지 않는 요소에서는 작동 할 수 없습니다.

window.onload = function() 
{ 
    ... 
} 

Answer 2

DOM 요소가 아직 페이지에로드되어 있지 않기 때문에 페이지의 준비 이벤트를 적절하게 처리해야합니다. jQuery는이를 추상화하지만 jQuery 또는 다른 라이브러리없이이 작업을 수행하는 방법에 대해이 게시물을 살펴 보자. 다음 가이드에서 수행 할 브라우저의 차이점을 확실하게 처리해야합니다. 당신은 getElementByID 제외하고는 제대로하고있는

$(document).ready equivalent without jQuery

Answer 3

는 함수가 아닙니다. getElementById이어야합니다. d에 주목하십시오.

document.getElementById("bottomrow").style.display = "none";