js获取内联样式的方法


Posted in Javascript onJanuary 27, 2015

本文实例讲述了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程序设计有所帮助。

Javascript 相关文章推荐
Js切换功能的简单方法
Nov 23 Javascript
JS 各种网页尺寸判断实例方法
Apr 18 Javascript
浅析XMLHttpRequest的缓存问题
Dec 13 Javascript
Angular2 多级注入器详解及实例
Oct 30 Javascript
详解JS中的this、apply、call、bind(经典面试题)
Sep 19 Javascript
微信小程序 页面跳转事件绑定的实例详解
Sep 20 Javascript
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
Mar 28 jQuery
npm 语义版本控制详解
Sep 10 Javascript
js实现简单的日历显示效果函数示例
Nov 25 Javascript
js实现九宫格布局效果
May 28 Javascript
在webstorm中配置less的方法详解
Sep 25 Javascript
如何用JS实现简单的数据监听
May 06 Javascript
js获取元素外链样式的方法
Jan 27 #Javascript
jquery复选框多选赋值给文本框的方法
Jan 27 #Javascript
jQuery+ajax实现动态执行脚本的方法
Jan 27 #Javascript
javascript将异步校验表单改写为同步表单
Jan 27 #Javascript
JavaScript中实现sprintf、printf函数
Jan 27 #Javascript
javascript批量修改文件编码格式的方法
Jan 27 #Javascript
JavaScript中的包装对象介绍
Jan 27 #Javascript
You might like
PHP编实现程动态图像的创建代码
2008/09/28 PHP
ThinkPHP学习笔记(一)ThinkPHP部署
2014/06/22 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
PHP获取当前相对于域名目录的方法
2015/06/26 PHP
探究Laravel使用env函数读取环境变量为null的问题
2016/12/06 PHP
EarthLiveSharp中cloudinary的CDN图片缓存自动清理python脚本
2017/04/04 PHP
php数组实现根据某个键值将相同键值合并生成新二维数组的方法
2017/04/26 PHP
laravel migrate初学常见错误的解决方法
2017/10/11 PHP
详解php中生成标准uuid(guid)的方法
2019/04/28 PHP
laravel 实现根据字段不同值做不同查询
2019/10/23 PHP
jQuery.getScript加载同域JS的代码
2012/02/13 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
2014/10/29 Javascript
JavaScript小技巧整理
2015/12/30 Javascript
AngularJS整合Springmvc、Spring、Mybatis搭建开发环境
2016/02/25 Javascript
JS延时器提示框的应用实例代码解析
2016/04/27 Javascript
JS 实现分页打印功能
2018/05/16 Javascript
element-ui 中的table的列隐藏问题解决
2018/08/24 Javascript
jquery实现联想词搜索框和搜索结果分页的示例
2018/10/10 jQuery
详解Vue3 Composition API中的提取和重用逻辑
2020/04/29 Javascript
[01:55]《走出家门看比赛》——DOTA2 2015国际邀请赛同城线下观战
2015/07/18 DOTA
Python入门篇之文件
2014/10/20 Python
详解Python程序与服务器连接的WSGI接口
2015/04/29 Python
python使用flask与js进行前后台交互的例子
2019/07/19 Python
Python实现图片识别加翻译功能
2019/12/26 Python
Python实现动态给类和对象添加属性和方法操作示例
2020/02/29 Python
Python运行提示缺少模块问题解决方案
2020/04/02 Python
Python利用myqr库创建自己的二维码
2020/11/24 Python
澳大利亚电子产品购物网站:Dick Smith
2017/02/02 全球购物
意大利和国际奢侈品牌购物网站:Suitnegozi.com
2021/01/15 全球购物
中软国际Java程序员笔试题
2014/07/19 面试题
95%的面试官都会问到的50道Java线程题,附答案
2012/08/03 面试题
家居装修公司创业计划书范文
2014/03/20 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
助学金申请书该怎么写?
2019/07/16 职场文书
导游词之云南省玉龙雪山
2019/12/19 职场文书
MySQL数据库如何使用Shell进行连接
2022/04/12 MySQL