js获取内联样式的方法

 更新时间:2015年01月27日 11:01:52   投稿:shichen2014  
这篇文章主要介绍了js获取内联样式的方法,针对标准浏览器与IE浏览器进行不同的判断与获取,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了js获取内联样式的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>javascript 获取内联样式</title>
</head>

<style>
#box{
width:100px;
height:100px;
background-image:url(1.jpg);
background-size:140% 140%;
background-repeat:no-repeat;
border:20px solid rgba(0,0,0,.3);
background-clip:border-box;
background-position:-20px -20px;
}
</style>
<body>
<div id="box"></div>
</body>
</html>
<script>
//获取内联样式元素
function getStyle( obj , attr )
{
if ( window.getComputedStyle ) {
return getComputedStyle( obj , null )[attr];
}else{
return obj.currentStyle[attr];
}
}
//获取对象
function $(id){
return document.getElementById(id);
}
var box = $('box');

//打印样式
alert(getStyle(box , 'background-position'));
</script>

希望本文所述对大家的javascript程序设计有所帮助。

相关文章

  • js opener的使用详解

    js opener的使用详解

    在JS中,window.opener只是对弹出窗口的母窗口的一个引用。本篇文章主要是对js中opener的使用进行了详细介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • JS实现判断移动端PC端功能

    JS实现判断移动端PC端功能

    这篇文章主要介绍了JS实现判断移动端PC端功能,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-02-02
  • JavaScript函数的4种调用方法实例分析

    JavaScript函数的4种调用方法实例分析

    这篇文章主要介绍了JavaScript函数的4种调用方法,结合实例形式总结分析了javascript函数调用常见操作技巧与注意事项,需要的朋友可以参考下
    2019-03-03
  • js 兼容多浏览器的回车和鼠标焦点事件代码(IE6/7/8,firefox,chrome)

    js 兼容多浏览器的回车和鼠标焦点事件代码(IE6/7/8,firefox,chrome)

    本文讲一下js实现兼容IE6/7/8,firefox,chrome浏览器的回车和鼠标焦点事件的代码。
    2010-04-04
  • JS中如何克隆对象(深克隆浅克隆递归克隆)

    JS中如何克隆对象(深克隆浅克隆递归克隆)

    这篇文章主要介绍了JS中如何克隆对象(深克隆浅克隆递归克隆)的全面探索,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2024-01-01
  • 网站导致浏览器崩溃的原因总结(多款浏览器) 推荐

    网站导致浏览器崩溃的原因总结(多款浏览器) 推荐

    对于访客,如果登录您网站,浏览器就立刻崩溃,我想这对谁都是无法容忍的,对此总结了网站导致浏览器崩溃的原因
    2010-04-04
  • 微信小程序进入广告实现代码实例

    微信小程序进入广告实现代码实例

    这篇文章主要介绍了微信小程序进入广告实现代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-09-09
  • 微信小程序商品详情页规格属性选择示例代码

    微信小程序商品详情页规格属性选择示例代码

    这篇文章主要介绍了微信小程序商品详情页规格属性选择的示例代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-10-10
  • 深入理解Javascript里的依赖注入

    深入理解Javascript里的依赖注入

    我喜欢引用这句话,“程序是对复杂性的管理”。计算机世界是一个巨大的抽象建筑群。我们简单的包装一些东西然后发布新工具,周而复始。现在思考下,你所使用的语言包括的一些内建的抽象函数或是低级操作符。这在JavaScript里是一样的
    2014-03-03
  • nuxt配置通过指定IP和端口访问的实现

    nuxt配置通过指定IP和端口访问的实现

    这篇文章主要介绍了nuxt配置通过指定IP和端口访问的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-01-01

最新评论