항상 아래로 스크롤하는 방법은 무엇입니까?

div에 텍스트를 추가 할 때 맨 아래로 스크롤 스크롤을 내리고 싶습니다. 이것은 내 코드입니다. 나는 그것이 왜 효과가 없는지 알 수 없다.항상 아래로 스크롤하는 방법은 무엇입니까?

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title></title> 
     <script> 
      window.onload =() => { 
       const add = document.getElementById('add'); 
       const c = document.getElementById('content'); 
       add.addEventListener('click',() => { 
        c.innerHTML += '<p>aaaaa</p>'; 
        c.scrollTop = c.scrollHeight; 
       }); 
      }; 
     </script> 
    </head> 
    <body> 
     <button id="add">add</button> 
     <div id="content"> 
     </div> 
    </body> 
</html>

출처

2016-08-03 user3130007

scrollIntoView 방법을 사용하는 것이 좋습니다.

대신 c.scrollTop = c.scrollHeight; 대신 c.scrollIntoView(false);을 입력하십시오.

div에 동적으로 요소를 추가했기 때문에 시도한 해결책 (c.scrollTop = c.scrollHeight;)이 작동하지 않습니다. 나는 그런 해결책이 일회성 계약이라는 것을 의미한다. 내용을 변경하면 스크롤을 다시 실행해야합니다.

window.scrollTo(0,c.scrollHeight);

출처

2016-08-03 12:57:14

'c.scrollIntoView (false);'잘 동작합니다. – user3130007

@ user3130007 예, 매우 유용합니다. –

, 당신은이를 사용해야합니다

그 외에, 당신은 window.scrollTo 방법을 사용하여 다음과 같은 트릭을 할 수 있습니다 그렇지 않으면 계속해서 스크롤해야 계속 버튼의 위치를 고정하는 것을 잊지 마십시오.

출처

2016-08-03 12:58:44

'c.scrollTop = c.scrollHeight; 대신'window.scrollTo (c.scrollHeight, 0);'를 사용한다는 뜻입니다. – user3130007

예 그게 효과가 있다고 생각합니다. –

@ user3130007 나는 그 말을 믿습니다. 그러나 인수는 반드시 반대로 전달되어야합니다 :'window.scrollTo (0, c.scrollHeight); ' –

사용 scrollIntoView() 대신 scrollTop & scrollHeight : 당신은 아래로 스크롤하려면

window.scrollTo(0, c.scrollHeight);

출처

2016-08-03 13:06:12

팁 주셔서 감사합니다. – user3130007

항상 아래로 스크롤하는 방법은 무엇입니까?

답변

관련 문제