获取元素样式对象 页面滚出 页面可是大小 添加监听事件 获取事件参数浏览器中位置 的兼容

/** * 获取浏览滚动出去的距离 * @returns {{scrollY: (Number|number), scrollX: (Number|number)}} */function scroll(){    return{        scrollY:window.scrollY||document.body.scrollTop||document.documentElement.scrollTop||0,        scrollX:window.scrollX||document.body.scrollLeft||document.documentElement.scrollLeft||0    }

}
/** * 获取在浏览器中的位置 * @param e * @returns {{pageX: (*|Number), pageY: (*|Number)}} */function getPage(e){    return{        pageX: e.pageX|| (e.clientX+scroll().scrollX),        pageY: e.pageY||(e.clientY+scroll().scrollY)    }

}
/** * 事件参数 * @type {{addEventListener: Function}} */var Eventtools={    /**     * 添加事件监听者     * @param element     * @param type     * @param listener     */    addEventListener:function(element,type,listener){        if(element.addEventListener){            element.addEventListener(type,listener,false)        }else if(element.attachEvent){            element.attachEvent("on"+type,listener)        }else{            element["on"+type]=listener;        }    }}
/样式对象兼容var setStyle = {    toOpacity: function (a, b) {        a.style.opacity = b;        a.style.filter = "alpha(opacity=" + b * 100 + ")";    }};
/** * 获取元素样式对象 * @param element * @param arrt * @returns {*} */function getStyle(element, arrt) {    if (window.getComputedStyle) {        return window.getComputedStyle(element, null)[arrt];    } else {        return element.currentStyle[arrt];    }

}
时间: 2024-12-23 02:17:23

获取元素样式对象 页面滚出 页面可是大小 添加监听事件 获取事件参数浏览器中位置 的兼容的相关文章

原生js获取元素样式

摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之前先说下获取最终应用在元素上的所有CSS属性对象的意思是,如果没有给元素设置任何样式,也会把浏览器默认的样式返回来. 1.ele.style 在学习DOM的时候就看到通过ele.style来获取元素样式值,但是有时候获取的并非是节点的样式值,而是空值.这是因为ele.style只能获取写在元素标签中

原生js获取元素样式值

在学习js初期,就一直有一个疑问,获取元素样式的值,不是直接使用obj.style.left之类的就可以得到了吗?可是使用这样的方式,有的时候能够获取得到,有的时候又不能获取,一直疑惑不已,但是由于以前学习态度的问题,也没有深究,今天专门花了点时间整理了一下这方面的知识. 样式 首先,我们要明确样式的种类有以下三种 内联样式: 也就是行内样式,直接写在DOM元素的style属性中 嵌入样式: 写在html页面中的<style></style>中的样式 外部样式: 由link标签引入

javascript 获取元素样式的方法

javascript 获取元素样式常用方法. Javascript获取CSS属性值方法:getComputedStyle和currentStyle 1 .对于元素的内联CSS样式(<div style="color:#369">hello</div>),可以直接使用element.style.color来直接获取css属性的值: 2. 但是对于外部定义的css样式使用这种方式就无法获取了,而且IE浏览器和其他标准浏览器(Firefox,Chrome,Opera,

函数return/获取元素样式/封装自己的库

一:函数return <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title>   <script>   // return 返回值 // 数字.字符串.布尔.函数.对象(元素\[]\{}\null).未定

JavaScript获取元素样式

原生的JavaScript获取写在标签内部的样式很简单: <div class="test" id="test" style="width:100px;">test</div> <script type="text/javascript"> window.onload=function(){ var oTest=document.getElementById("test"

js获取元素样式方法

? 1 2 3 4 5 6 7 8 function getStyle(ojb,attr){       if(obj.currentStyle){             return obj.currentStyle[attr];       }         else{            return getComputedStyle(obj,false)[attr];        } } js获取元素样式方法,布布扣,bubuko.com

jquery获取元素各种宽高及页面宽高总结

window.onload=function(){ var a = $("#div").width(),//width()返回元素的宽高,不包括padding/border/margin b = $("#div").innerWidth(),//innerWidth()返回元素的宽高 + padding c = $("#div").outerWidth(),//outerWidth()返回元素的宽高 + padding + border d =

jquery获取元素各种宽高及页面宽高

如何使用jquery来获取网页里各种高度? 示例如下: 1 $(document).ready(function(){ 2 var divWidth = $("#div").width(),//width()返回元素的宽高,不包括padding/border/margin 3 divInnerWidth = $("#div").innerWidth(),//innerWidth()返回元素的宽高 + padding 4 divOuterWidth = $("

js获取元素样式包括非行内样式

var obj=document.getElementById("id"): 由于js新版本的发放,越来越多的人喜欢用原生js而非jquery对dom元素进行操作,那么如果通过js获取dom元素的样式呢,很多人都知道用obj.style这种方式,但是,这种方式只能获取dom行内样式,一旦,我们定义class,然后再css文件里写时就会获取不到,下面我主要介绍获取行内样式和获取非行内样式两种获取方法. 1,获取行内样式. <div style="width:200&quo