2017-12-22 15 views
0

의 재산 '는 TextContent'을 설정할 수 없습니다 :내가 오류이 몇 가지 이유로 널

document.getElementById("days").textContent = d; 

function countdown() { 
 
    var now = new Date(); 
 
    var eventDate = new Date(2018, 1, 19); 
 
    var currentTime = now.getTime(); 
 
    var eventTime = eventDate.getTime(); 
 
    var remTime = eventTime - currentTime; 
 
    var s = Math.floor(remTime/1000); 
 
    var m = Math.floor(s/60); 
 
    var h = Math.floor(m/60); 
 
    var d = Math.floor(h/24); 
 
    h %= 24; 
 
    m %= 60; 
 
    s %= 60; 
 
    h = (h < 10) ? "0" + h : h; 
 
    m = (m < 10) ? "0" + m : m; 
 
    s = (s < 10) ? "0" + s : s; 
 

 
    document.getElementById("days").textContent = d; 
 
    document.getElementById("days").innerText = d; 
 

 
    document.getElementById("hours").textContent = h; 
 

 
    document.getElementbyId("minutes").textContent = m; 
 

 
    document.getElementById("seconds").textContent = s; 
 
} 
 
countdown();
<li> 
 
    <span class="value">Ends in: 
 
    </span> 
 
    <p id="days">30</p> 
 
    <p id="hours">10</p> 
 
    <p id="minutes">5</p> 
 
    <p id="seconds">1</p> 
 
</li>

+3

있습니까? 'document.getElementbyId ("minutes")'b'가 대문자이어야하는 곳에 오류가 있습니다. –

+0

게시 한 HTML 스 니펫이 실제로로드되기 전에 countdown() 함수가 실행되어 결과적으로 id "days"가있는 요소를 찾을 수 없으며 getElementById가 null을 반환합니다. 이는 분명히 지정된 속성을 포함하지 않습니다. 오류 메시지. – fatherOfWine

답변

0

:이 라인에 null의 특성 '는 TextContent'을 설정할 수 없습니다 문제는 요소가 "카운트 다운"이 실행될 때 존재하지 않을 수 있습니다 ... 당신이 조회중인 요소 집합을 포함하고있는 body/div의 countdown onload를 호출해볼 수 있습니까?

document.getElementbyId("minutes").textContent = m; 

이 코드가 예상대로 작동하는지 고정 : 내가 볼

<body onload="countdown()"> 
+1

그런 HTML 내에서 JavaScript를 사용하는 것은 좋지 않습니다. –

0

유일한 문제는 당신 b 요구 사항이 줄에 대문자 할 수 있다는 것입니다

function countdown() { 
 
    var now = new Date(); 
 
    var eventDate = new Date(2018, 1, 19); 
 
    var currentTime = now.getTime(); 
 
    var eventTime = eventDate.getTime(); 
 
    var remTime = eventTime - currentTime; 
 
    var s = Math.floor(remTime/1000); 
 
    var m = Math.floor(s/60); 
 
    var h = Math.floor(m/60); 
 
    var d = Math.floor(h/24); 
 
    h %= 24; 
 
    m %= 60; 
 
    s %= 60; 
 
    h = (h < 10) ? "0" + h : h; 
 
    m = (m < 10) ? "0" + m : m; 
 
    s = (s < 10) ? "0" + s : s; 
 

 
    document.getElementById("days").textContent = d; 
 
    document.getElementById("days").innerText = d; 
 

 
    document.getElementById("hours").textContent = h; 
 

 
    document.getElementById("minutes").textContent = m; 
 

 
    document.getElementById("seconds").textContent = s; 
 
} 
 
countdown();
<li> 
 
    <span class="value">Ends in: 
 
    </span> 
 
    <p id="days">30</p> 
 
    <p id="hours">10</p> 
 
    <p id="minutes">5</p> 
 
    <p id="seconds">1</p> 
 
</li>

c DOM로드가 완료되면 ode가 실행됩니다.

이 같은 수행 할 수

document.addEventListener('DOMContentLoaded',() => countdown()); 
+0

그 오타가이 오류를 일으키지 않으면 다른 오류가 발생할 수 있습니다. – Barmar

+0

내 대답은 오타가 아닌 코드에 오류가 없다고 말합니다. 또한 코드가 dom 다음에 실행되어야한다고도합니다. –

0

오류가 있습니다 getElementById 대신 getElementbyId을.

새로운 코드는 다음과 같습니다 당신은 그 선 있는지

function countdown() { 
 
    var now = new Date(); 
 
    var eventDate = new Date(2018, 1, 19); 
 
    var currentTime = now.getTime(); 
 
    var eventTime = eventDate.getTime(); 
 
    var remTime = eventTime - currentTime; 
 
    var s = Math.floor(remTime/1000); 
 
    var m = Math.floor(s/60); 
 
    var h = Math.floor(m/60); 
 
    var d = Math.floor(h/24); 
 
    h %= 24; 
 
    m %= 60; 
 
    s %= 60; 
 
    h = (h < 10) ? "0" + h : h; 
 
    m = (m < 10) ? "0" + m : m; 
 
    s = (s < 10) ? "0" + s : s; 
 

 
    document.getElementById("days").textContent = d; 
 
    document.getElementById("days").innerText = d; 
 

 
    document.getElementById("hours").textContent = h; 
 

 
    document.getElementById("minutes").textContent = m; 
 

 
    document.getElementById("seconds").textContent = s; 
 
} 
 
countdown();
<li> 
 
    <span class="value">Ends in: 
 
    </span> 
 
    <p id="days">30</p> 
 
    <p id="hours">10</p> 
 
    <p id="minutes">5</p> 
 
    <p id="seconds">1</p> 
 
</li>

+0

그 오타가이 오류를 일으키지 않습니다. – Barmar