JS, Jquery는 다양한 화면의 폭과 높이를 가져옵니다.clientX,offsetX,부모 창에서 iframe의 요소를 가져옵니다.

자세히 보기
JS, Jquery 화면의 폭과 높이 가져오기
Javascript:
웹 페이지의 가시 영역 폭:document.body.clientWidth
웹 페이지의 가시 영역이 높음:document.body.clientHeight
웹 페이지의 가시 영역 폭:document.body.offsetWidth(선가중치 포함)
웹 페이지의 가시 영역이 높음:document.body.offsetHeight(모서리 높이 포함)
웹 페이지 본문 전문폭:document.body.scrollWidth
웹 페이지의 본문 전문이 높습니다:document.body.scrollHeight
웹 페이지가 말아 넣은 높이:document.body.scrollTop
웹 페이지의 왼쪽: 문서.body.scrollLeft
웹 페이지의 본문 부분: window.screenTop
웹 페이지의 본문 부분 왼쪽: window.screenLeft
높은 화면 해상도: window.screen.height
화면 해상도: window.screen.width
스크린 사용 가능한 작업공간 높이: window.screen.availHeight
스크린 사용 가능한 작업공간 너비: window.screen.availWidth
JQuery:
$(document).ready(function(){
  alert($(window).height());//브라우저 현재 창 가시 영역 높이
  alert($(document).height());//브라우저의 현재 창 문서 높이
  alert($(document.body).height());//브라우저 현재 창 문서 바디 높이
  alert($(document.body).outerHeight(true));//브라우저 현재 창 문서body의 총 높이는border padding margin을 포함합니다
  alert($(window).width());//브라우저 현재 창 가시 영역 너비
  alert($(document).width());//브라우저 현재 창 문서 객체 폭
  alert($(document.body).width());//브라우저 현재 창 문서 바디의 폭
  alert($(document.body).outerWidth(true));//브라우저 현재 창 문서body의 총 너비는border padding margin을 포함합니다
});
clientX는 마우스 포인터의 위치가 창 클라이언트 구역에 대한 x 좌표를 설정하거나 가져옵니다. 그 중에서 클라이언트 구역은 창 자체의 컨트롤과 스크롤 바를 포함하지 않습니다.
clientY는 마우스 포인터의 위치가 창 클라이언트 구역에 대한 y 좌표를 설정하거나 가져옵니다. 그 중에서 클라이언트 구역은 창 자체의 컨트롤과 스크롤 바를 포함하지 않습니다.
offsetX 이벤트를 촉발하는 대상에 대한 마우스 포인터 위치를 설정하거나 가져옵니다.
offsetY 이벤트를 촉발하는 대상에 대한 마우스 포인터 위치를 설정하거나 가져옵니다.
screenX 설정이나 마우스 포인터의 위치가 사용자 화면에 대한 x 좌표를 가져옵니다.
screenY는 사용자 화면에 대한 마우스 포인터 위치의 y 좌표를 설정하거나 가져옵니다.
x 포인터 위치가 부모 문서에 대한 x 픽셀 좌표를 설정하거나 가져옵니다.
y 부모 문서에 대한 마우스 포인터 위치의 y 픽셀 좌표를 설정하거나 가져옵니다.
event.clientX 반환 이벤트가 발생했을 때,mouse는 클라이언트 창의 X 좌표에 대한 이벤트입니다.X도 마찬가지다.
그러나 이벤트 대상의 포지셔닝 속성 값이relative, 이벤트로 설정되면clientX는 변경되지 않으며 이벤트는 변경되지 않습니다.X는 이벤트 객체의 본체를 기준으로 하는 좌표를 반환합니다.

 
var strInfo="";
strInfo+="rn       :"+document.body.clientWidth;
strInfo+="rn       :"+document.body.clientHeight;
strInfo+="rn       :"+document.body.offsetWidth+"(      )";
strInfo+="rn       :"+document.body.offsetHeight+"(      )";
strInfo+="rn       :"+document.body.scrollWidth;
strInfo+="rn       :"+document.body.scrollHeight;
strInfo+="rn       :"+document.body.scrollTop;
strInfo+="rn       :"+document.body.scrollLeft;
strInfo+="rn       :"+window.screenTop;
strInfo+="rn       :"+window.screenLeft;
strInfo+="rn       :"+window.screen.height;
strInfo+="rn       :"+window.screen.width;
strInfo+="rn         :"+window.screen.availHeight;
strInfo+="rn         :"+window.screen.availWidth;
window.confirm(strInfo);

x: 대상 이벤트의 부모 요소에 대한 마우스의 외부 경계가 x 좌표에 있는 위치를 설정하거나 가져옵니다.
clientX: 클라이언트 영역의 x 좌표 위치에 비해 스크롤 바가 포함되지 않고 본문 영역입니다.
offsetx: 대상 이벤트의 부모 요소에 대한 마우스의 내부 경계가 x 좌표에 있는 위치를 설정하거나 가져옵니다.
screenX:사용자 스크린에 상대적
코드는 다음과 같다.

Click here to show.




function show(){
alert("window.event.x:"+window.event.x+"nwindow.event.y:"+window.event.y+"nevent.clientX:"+event.clientX+"nevent.clientY:"+event.clientY+"nevent.offsetX:"+event.offsetX+"nevent.offsetY:"+event.offsetY+"nwindow.event.screenX:"+window.event.screenX+"nwindow.event.screenY:"+window.event.screenY);
}

 
 
event.clientX       ,mouse        X   
 
   event.X    
 
                    relative 
 
   event.clientX   
 
    event.X                
 
   event     ICOOE 2000.3.31 http://www.hzhuti.com 
 
   event       ，          、       ，event            。 
 
 
 
 
 
    
 
   event  ：    
 
   altKey 
 
     ALT       
 
        true    
 
   false     
 
    
 
   button 
 
            
 
       ： 0     
 
   1     
 
   2     
 
   3      
 
   4      
 
   5         
 
   6         
 
   7       
 
    
 
   cancelBubble 
 
                      
 
       ： false      
 
   true         
 
    
 
   clientX 
 
                    X  ，     ，     。 
 
    
 
   clientY 
 
                    Y  ，     ，     。 
 
    
 
   ctrlKey 
 
   ctrlKey   CTRL       
 
        true    
 
   false     
 
    
 
   dataFld 
 
      oncellchange       
 
    
 
   aTransfer 
 
                   。 
 
    
 
   Element 
 
      on mouseover on mouseout            
 
    
 
   keyCode 
 
                     Unicode      
 
       onkeydown onkeyup onkeypress     
 
               ，    0 
 
    
 
   offsetX 
 
                          
 
    
 
   offsetY 
 
                          
 
    
 
   propertyName 
 
                   
 
    
 
   reason 
 
                  
 
       ： 
 
   0        
 
   1        
 
   2        
 
    
 
   recordset 
 
                    
 
          
 
    
 
   repeat 
 
               
 
         onkeydown        true 
 
    
 
   returnvalues 
 
                 
 
       ： 
 
   true          
 
   false                
 
    
 
   screenX 
 
                    
 
    
 
   screenY 
 
                    
 
    
 
   shiftKey 
 
     shiftKey       
 
        true    
 
   false     
 
    
 
   srcElement 
 
             
 
    
 
   srcFilter 
 
       onfilterchange           
 
    
 
   srcUm 
 
                   
 
              ，         null 
 
   1.               
 
   2.                    URN           
 
    
 
   toElement 
 
       on mouseover  on mouseout           
 
    
 
   type 
 
                
 
    
 
   x 
 
                     
 
    
 
   y 
 
                     
 
 
 
 
 
js 
 
 
 
       iframe     
 
 
 
1. 
 
 
 
      ：window.frames["iframe name "].document.getElementById("iframe    ID").click();  
 
      ：window.frames["ifm"].document.getElementById("btnOk").click();  
 
 
 
 2. 
 
 
 
      ：  
 
    var obj=document.getElementById("iframe name").contentWindow;  
 
    var ifmObj=obj.document.getElementById("iframe    ID");  
 
    ifmObj.click();  
 
      ：  
 
    var obj=document.getElementById("ifm").contentWindow;  
 
    var ifmObj=obj.document.getElementById("btnOk");  
 
    ifmObj.click();  
 
 
 
  iframe          
 
 
 
      ：window.parent.document.getElementById("      ID").click();  
 
      ：window.parent.document.getElementById("btnOk").click();  
 
 
 
 
 
 
 
jquery 
 
 
 
       iframe     
 
 
 
1. 
 
 
 
      ：$("#iframe ID").contents().find("#iframe    ID").click();//jquery   1  
 
      ：$("#ifm").contents().find("#btnOk").click();//jquery   1  
 
 
 
2. 
 
 
 
      ：$("#iframe    ID",document.frames("frame name").document).click();//jquery   2  
 
      ：$("#btnOk",document.frames("ifm").document).click();//jquery   2  
 
 
 
  iframe          
 
 
 
      ：$('#       ID', parent.document).click();  
 
      ：$('#btnOk', parent.document).click();