获取浏览器窗口相对于屏幕的位置,获取可视窗口的宽高、元素的样式或伪元素的样式

时间:2022-02-08 10:48:49

获取浏览器窗口相对于屏幕的位置

    
    var leftPos = typeof window .screenLeft === "number" ?

window .screenLeft : window .screenX ,


topPos = typeof window .screenTop === "number" ?
window .screenTop : window .screenY ;


console .log (leftPos );  //火狐下x|y都为-8;因为浏览器有8px的左边框在屏幕外,缩小窗口可看到


获取可视窗口的宽高

var w = window.innerWidth || document.documentElement.clientWidth;

var h = window.innerHeight || document.documentElement.clientHeight;

获取元素的样式或伪元素的样式

    
    function getStyle (elem , prop ) {
if (window .getComputedStyle ) {
// getComputedStyle的第二个参数设置为"after"、"before" 可以获取元素内伪元素的样式
return window .getComputedStyle (elem , null )[prop ];
} else {
return elem .currentStyle [prop ];
}

}

getStyle (document .getElementById ( 'id' ), 'border' )