原生js获取样式
js中的获取样式是在是让人头疼,为了方便兼容多个浏览器,把设置样式封装成一个函数。
函数如下:
function getStyle(element, property) {
var value = element.style[property];
if(!value){
if(window.getComputedStyle) { //非IE
value = window.getComputedStyle(element,null)[property];
} else if(element.currentStyle) { //IE
value = element.currentStyle[camelize(property)];
}
}
return value;
}
下面将分析下设置样式的几种方法:
- 1、element.style:只能获取写在元素标签中的style属性里的样式值,无法获取到定义在和通�%8�加载进来的样式属性
- 2、window.getComputedStyle():可以获取当前元素所有最终使用的CSS属性值(高级属性)。
- 3、element.currentStyle:IE 专用,返回的是元素当前应用的最终CSS属性值(包括外链CSS文件,页面中嵌入的属性等)。
原生js获取样式的更多相关文章
- 原生js获取元素的样式信息
工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...
- 原生js获取display属性注意事项
原生js获取diaplay属性需要在标签上写行间样式style='display:none/block;' <div style="display:block;">&l ...
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- 兼容各版本浏览器,封装原生Js获取ClassName
web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...
- 原生js获取Html元素的实际宽度高度
第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. 第 ...
- 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离
关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...
- 原生js获取宽高与jquery获取宽高的方法的关系
说明:1.因为获取高度的情况跟获取宽度的情况一样,所以以下只说获取宽度的情况. 2.以下所说的所有方法与属性所返回的值都是不带单位的. 3.为了方便说明,以下情况采用缩写表示: obj -> ...
- 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较
一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
随机推荐
- 获取父iframe的高宽
var p_window = window.top; //alert($(p_window).height()); var p_demo = window.top.docu ...
- 【原】CSS3的3D动画 ——3D旋转之骰子样式的钟表(2)下.md
之前看到智能社主页的那个骰子样式的钟表,最近研究了一下,虽然没有仔细看他是怎么做的,但是学了css3的动画之后想自己尝试着写一下,用到的原理可能和智能社网站的不太一样,我自己主要用到了css3和js. ...
- Windows,caffe 仅cpu
http://caffe.berkeleyvision.org/installation.html 按着官网的步骤:https://github.com/BVLC/caffe/tree/windows ...
- shell 初学者 必读 ,强烈推荐新手读
背景: 很多人从C/C++转化而来,看了学习文档之后,踩入了很多坑 1 对变量赋值 不要有空格 a=123 # 正确 a = 123 # 错误 2 if语句 [] 要留有空格,变量最好加" ...
- js实现多个图片淡入淡出,框架
单个淡入淡出已经写过,可以看看上几遍的博文 <style> *{ margin:0; padding:0; } div{ height:100px; width:100px; backgr ...
- python笔记一
好奇,想一探究竟.安装就出点小问题,win7,64位,一直卡在这里不动了? 只好取消.第二天安装仍是如此. 于是下载Windows6.1-KB2999226-x64.msu,安装,仍卡顿不动: 于是找 ...
- maximo功能修改笔记
经过前几次的简单的修改系统功能,对maximo的bean开发已经有了一定了解,现在是耗时近两个礼拜来修改了一项系统功能,所用到的知识 Bean Fld, 下面我认真总结修改功能过程中的学到的知识: 目 ...
- 无法使用内置管理员账户打开Microsoft Edge
一.以管理员批准模式运行所有管理员 运行"gpedit.msc",打开本地组策略编辑器,然后依次打开"计算机配置→Windows 设置→安全设置→本地策略→安全选项&qu ...
- 3.openssl speed和openssl rand
(1).openssl speed 测试加密算法的性能. 支持的算法有: openssl speed [md2] [mdc2] [md5] [hmac] [sha1] [rmd160] [idea-c ...
- ipad或iPhone 访问https网站不成功
可能的原因是设备的日期不对,将设备日期调整正确即可解决