How to implement DIV can only display three pieces of data, the data of the new data will be added to the previous data, similar to the data scrolling up.


<div>
<p id=1>
<p id=2>
<p id=3>
</div>
p1
<div>
<p id=2>
<p id=3>
<p id=4>
</div>

how to implement DIV can only display 3 pieces of data, and the new data will top up the previous data, similar to scrolling up the data. The overflow property of DIV can hide the overflowed content but cannot show the new content.

data is added by javascript after the event is triggered.

Mar.04,2021

you can solve the problem you said with css. As follows:

  

add a new node when the event is triggered. Get all the child elements of the current DIV var cont=document.getElementById (DIV) .childNotes within the trigger event, use if to determine the length of the current element, and delete con [0] if it is greater than N;
forms the effect that there are only N elements in DIV, and the new element will top up the previous element.

Menu