JS.elementGetStyle(element, style)应用示例


Posted in Javascript onSeptember 24, 2013

注: 获取Dom元素的Style数组中的指定Style元素

function elementGetStyle(element, style) { 
var value = null; 
if (element.style) { 
value = element.style[style]; 
} 
if (!value) { 
if (document.defaultView && document.defaultView.getComputedStyle) { 
var css = document.defaultView.getComputedStyle(element, null); 
value = css ? css.getPropertyValue(style) : null; 
} else if (element.currentStyle) { 
value = element.currentStyle[style]; 
} 
} 
/** DGF necessary? 
if (window.opera && ['left', 'top', 'right', 'bottom'].include(style)) 
if (Element.getStyle(element, 'position') == 'static') value = 'auto'; */ 

return value == 'auto' ? null : value; 
}

注:选定的Dom元素以color颜色高亮0.2s
function UiWebhighlight(element,color) { 
if (!element) {return} 
var highLightColor = "yellow"; 
if (color) {highLightColor = color} 
if (element.originalColor == undefined) { // avoid picking up highlight 
element.originalColor = elementGetStyle(element, "background-color"); 
} 
elementSetStyle(element, {"backgroundColor" : highLightColor}); 
window.setTimeout(function () { 
try { 
//if element is orphan, probably page of it has already gone, so ignore 
if (!element.parentNode) { 
return; 
} 
elementSetStyle(element, { "backgroundColor": element.originalColor }); 
} catch (e) { } // DGF unhighlighting is very dangerous and low priority 
}, 200); 
}
Javascript 相关文章推荐
Javascript 设计模式(二) 闭包
May 26 Javascript
js菜单点击显示或隐藏效果的简单实例
Jan 13 Javascript
JS 实现列表与多选框选择附预览动画
Oct 29 Javascript
JavaScript不使用prototype和new实现继承机制
Dec 29 Javascript
JavaScript插件化开发教程 (一)
Jan 27 Javascript
js+css实现上下翻页相册代码分享
Aug 18 Javascript
jQuery过滤选择器用法示例
Sep 12 Javascript
Ajax异步获取html数据中包含js方法无效的解决方法
Feb 20 Javascript
vue进行图片的预加载watch用法实例讲解
Feb 07 Javascript
解决layui 复选框等内置控件不显示的问题
Aug 14 Javascript
微信小程序页面上下滚动效果
Nov 18 Javascript
为什么node.js不适合大型项目
Apr 28 Javascript
jquery $.each()使用探讨
Sep 23 #Javascript
jQuery ajax dataType值为text json探索分享
Sep 23 #Javascript
jQuery实现类似滑动门切换效果的层切换
Sep 23 #Javascript
JS 实现导航栏悬停效果
Sep 23 #Javascript
jquery购物车实时结算特效实现思路
Sep 23 #Javascript
js下拉菜单语言选项简单实现
Sep 23 #Javascript
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
Sep 23 #Javascript
You might like
php fsockopen中多线程问题的解决办法[翻译]
2011/11/09 PHP
PHP开发注意事项总结
2015/02/04 PHP
PHP命令Command模式用法实例分析
2018/08/08 PHP
PHP7新功能总结
2019/04/14 PHP
表单元素事件 (Form Element Events)
2009/07/17 Javascript
Javascript的各种节点操作实例演示代码
2012/06/27 Javascript
JQuery实现table行折叠效果以JSON做数据源
2014/05/26 Javascript
使用js实现的简单拖拽效果
2015/03/18 Javascript
JavaScript字符串删除重复字符的方法
2015/12/25 Javascript
jQuery事件委托之Safari
2016/07/05 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
2017/06/16 Javascript
AngularJS动态绑定ng-options的ng-model实例代码
2017/06/21 Javascript
快速解决vue-cli不能初始化webpack模板的问题
2018/03/20 Javascript
Nodejs实现多文件夹文件同步
2018/10/17 NodeJs
vue单应用在ios系统中实现微信分享功能操作
2020/09/07 Javascript
Python单元测试框架unittest使用方法讲解
2015/04/13 Python
python基于pyDes库实现des加密的方法
2017/04/29 Python
Python实现的文本简单可逆加密算法示例
2017/05/18 Python
python的re正则表达式实例代码
2018/01/24 Python
python命令行解析之parse_known_args()函数和parse_args()使用区别介绍
2018/01/24 Python
python3+PyQt5实现柱状图
2018/04/24 Python
python实现一个简单的ping工具方法
2019/01/31 Python
win10下python2和python3共存问题解决方法
2019/12/23 Python
python对Excel的读取的示例代码
2020/02/14 Python
django项目中新增app的2种实现方法
2020/04/01 Python
Python flask框架实现查询数据库并显示数据
2020/06/04 Python
一文弄懂Pytorch的DataLoader, DataSet, Sampler之间的关系
2020/07/03 Python
Python OpenCV中的numpy与图像类型转换操作
2020/12/11 Python
试解释COMMIT操作和ROLLBACK操作的语义
2014/07/25 面试题
数控专业毕业生自荐信范文
2014/03/04 职场文书
骨干教师培训方案
2014/05/06 职场文书
ktv好的活动方案
2014/08/15 职场文书
普通党员个人整改措施
2014/10/27 职场文书
志愿服务心得体会
2016/01/15 职场文书
CSS实现五种常用的2D转换
2021/12/06 HTML / CSS
php解析非标准json、非规范json的方式实例
2022/05/10 PHP