js获取非行间样式(兼容ie和标准浏览器)

<body><div class="box" id="box" style="background-color: #f0f;color: #fff;"></div>
</body>

<style type="text/css">body{/* 加载背景图 */background-image: url();/* 背景图垂直、水平均居中 */background-position: center center;/* 背景图不平铺 */background-repeat: no-repeat;/* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */background-attachment: fixed;/* 让背景图基于容器大小伸缩 */background-size: cover;/* 设置背景颜色，背景图加载过程中会显示背景色 */background-color: #fff;}.box{width: 100%;min-height: 400px;margin: 0;padding: 0;background-color: #fff;}
</style>

1.一般情况下用js获取行间标签的属性值：

var myBody=document.getElementsByTagName('body')[0],
myBox=document.getElementById('box');
console.info(myBody.style.width);//没有值，因为body标签无法获取这个属性值。
console.info(myBox.style.width);//获取到该标签的行间样式值。

2.如果要获取非行间属性值：

对于IE9的浏览器：

console.info(myBox.currentStyle(attr));

对于ff等标准浏览器：

console.info(getComputedStyle(myBox,false)[attr])

ps：getComputedStyle(odiv,false)这里的两个参数，第一个参数代表要获取那个元素的样式，第二个是解决FF较低版本的写法，而对于高版本的可以不用写。

总结：获取非行间样式的写法：

function getStyle(obj,attr,value){if(obj.currentStyle){//针对ie获取非行间样式return obj.currentStyle(attr);}else{//标准浏览器ffreturn getComputedStyle(obj,false)[attr];}
}

本文参考资料：https://blog.csdn.net/yh674256/article/details/47039511

js获取非行间样式(兼容ie和标准浏览器)相关推荐

js获取非行间样式--有bug，忧伤
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
JS一起学05：Date对象、封闭空间、函数传参和封装、获取非行间样式、字符串操作
一.Date对象 1. 获取 oDate.getFullYear() 获取年份 oDate.getMonth()+1 获取月份 0-11----->1-12 oDate.getDate() 获 ...
[js]写一个获取非行间样式的方法
[js]写一个获取非行间样式的方法 window.getComputedStyle()?window.getComputedStyle(element).attribute:element.curre ...
JS(函数返回值、获取非行间样式、函数封装、函数复用、定时器)
// 函数返回值 // 什么时候需要用:函数外想要使用内部的数据的时候 // 语法: return 返回值 // 1.返回回函数里的值 function fun1 (){ var a = 1; ret ...
javascript-数据类型,json与数组,获取非行间样式
一.javascript组成: 1.ECMAScript 解释器 2.DOM (文档对象模型:document object model) document 3.BOM(浏览器对象模型:brow ...
JS中的DOM操作属性、DOM创建、DOM增加、DOM修改、DOM删除以及DOM获取非行间样式
当网页被加载时,浏览器会创建页面的文档对象模型DOM(Document Object Model),在DOM中,每个东西都是节点. DOM四大操作:查找.更新.添加.删除通过DOM,JavaScri ...
获取非行间样式的获取
当我们的样式写在行间的时候,JS可以通过style获取, 然而style也只能获取或操作行间样式,当我们需要获取非行间的样式时, 应该采用什么方法呢? 首先定义一个div并为他设置样式: <st ...
非行间样式函数封装代码复用定时器
1.获取行间样式标签.style.样式名如果样式名是-链接使用驼峰命名例如font-size fontSize ==标签.style.样式名只能获取行间样式== 2.获取非行间样式和行间样式 ...
JavaScript提取非行间样式
提取行间样式一般格式 object.style.width=value; 提取非行间样式 IE浏览器下的写法:obj.currentStyle.name 火狐浏览器或者谷歌浏览器的写法:g ...
JS获取鼠标位置，兼容IE FF
JS获取鼠标位置,兼容IE FF 由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事 ...

js获取非行间样式(兼容ie和标准浏览器)

js获取非行间样式(兼容ie和标准浏览器)相关推荐

最新文章

热门文章