개수가 x보다 많으면 모든 요소를 ​​제거하십시오.

Question

조금 주위를 둘러 보았고 DOM 요소가 50 개 이상인 경우 DOM 요소를 제거하는 방법을 찾지 못하는 것 같습니다. 기본적으로 채팅과 비슷합니다.

JS

function append(aVal) { 
    document.getElementById('elem').innerHTML += "<br/>" + aVal; 
} 

사용 나는 BR & 스팬 태그를 제거하기 위해 노력하고있어

<div id="elem" class="container"></div> 

appendvalues("<span>Your message " + message + ".</span>"); 

HTML. 페이지에 다른 span 태그가 있기 때문에 span 태그에 대한 클래스를 만드는 것이 좋을 것이라고 생각합니다.

Answer 1

나는 ... 당신이 FIFO를하고 싶지 나는 .innerHTML +=... 대신 .insertAdjacentHTML를 사용하고

function append(aVal) { 
    var el = document.getElementById('elem'); 
    el.insertAdjacentHTML("beforeend", "<br/>" + aVal); 

    var spans = el.getElementsByTagName("span"); 
    if (spans.length > 50) { 
     el.removeChild(spans[0].nextSibling); 
     el.removeChild(spans[0]); 
    } 
} 

주를 가정합니다. 이것은 HTML에서 내용을 추가하는 데 훨씬 덜 파괴적인 방법입니다.

Answer 2

원하는대로 할 수 있습니까?

$("#elem > span:gt(50)").remove();