원본 js 감청 스크롤 막대를 사용하여 밑에 도착하고 내용을 불러옵니다

1915 단어 web일상적

웹 페이지 스크롤 바가 밑에 도착했는지 판단

  • Document.onscroll
  • 세부 코드
  • 완전한 html 코드
  • Document.onscroll


    우선 문서의onscroll 방법으로 스크롤 바의 변화를 감청해야 한다
    document.onsroll = function () {
    		/******/
    }
    

    세부 코드


    가장 중요한 것은 문서의 스크롤 Height와 문서의 스크롤 Top을 통해 이루어져야 한다
    코드:
    	if (_container.scrollTop == (_container.scrollHeight - 640)) {
    			 var div=document.createElement('div');
    			 div.innerHTML = "ssss";
    			_container.appendChild(div)
    		}
    

    전체 html 코드

    	
    	
    		
    			
    			
    			
    			 <style>
    			  #container {
    			    position: absolute;
    			    height: auto;
    			    top: 0;
    			    bottom: 0;
    			    width: auto;
    			    left: 0;
    			    right: 0;
    			    overflow: auto;
    			  }
    			  
    			  #foo {
    			    height:1000px;
    			    width:1000px;
    			    
    			    display: block;
    			  }
    			  
    			  </style>
    		
    		
    		    <div id="container">
    		      <div id="foo">sssss</div>
    		    </div>
    		  
    		    <script type="text/javascript">
    				
    		      //js            dom,     document.body        
    		      //        dom  ,    container Id  
    			  _container = document.getElementById('container');
    		      _container.onscroll = function() {
    				console.log(document.getElementById('container').scrollHeight + " " + _container.scrollTop)
    		        if (_container.scrollTop == (_container.scrollHeight - 640)) {
    					 var div=document.createElement('div');
    					 div.innerHTML = "ssss";
    					_container.appendChild(div)
    				}
    		      };
    		    </script>
    		  
    	
    </code></pre> 
     </div> 
    </div>
                                </div>
                            </div>

    좋은 웹페이지 즐겨찾기