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 相关文章推荐
让广告代码不再影响你的网页加载速度
Jul 07 Javascript
用Javascript 获取页面元素的位置的代码
Sep 25 Javascript
jQuery简易图片放大特效示例代码
Jun 09 Javascript
jQuery实现的一个自定义Placeholder属性插件
Aug 11 Javascript
解决js下referer兼容各大浏览器的方法
Nov 03 Javascript
jquery实现对联广告的方法
Feb 05 Javascript
JS实现slide文字框缩放伸展效果代码
Nov 05 Javascript
js导出excel文件的简洁方法(推荐)
Nov 02 Javascript
canvas学习之API整理笔记(一)
Dec 29 Javascript
微信小程序-API接口安全详解
Jul 16 Javascript
微信小程序实现手势滑动卡片效果
Aug 26 Javascript
javascript 原型与原型链的理解及实例分析
Nov 23 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高级OOP技术演示
2009/08/27 PHP
浅析PHP绘图技术
2013/07/03 PHP
PHP处理大量表单字段的便捷方法
2015/02/07 PHP
十幅图告诉你什么是PHP引用
2015/02/22 PHP
php解析xml方法实例详解
2015/05/12 PHP
android上传图片到PHP的过程详解
2015/08/03 PHP
PHP7生产环境队列Beanstalkd用法详解
2020/05/19 PHP
php与阿里云短信接口接入操作案例分析
2020/05/27 PHP
运用jquery实现table单双行不同显示并能单行选中
2009/07/25 Javascript
Knockoutjs快速入门(经典)
2012/12/24 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
2015/08/24 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
2015/12/08 Javascript
JavaScript如何一次性展示几万条数据
2017/03/30 Javascript
Vue-cli proxyTable 解决开发环境的跨域问题详解
2017/05/18 Javascript
layui前段框架日期控件使用方法详解
2017/05/19 Javascript
IntersectionObserver实现图片懒加载的示例
2017/09/29 Javascript
使用命令行工具npm新创建一个vue项目的方法
2017/12/27 Javascript
Redux实现组合计数器的示例代码
2018/07/04 Javascript
layui关闭层级、简单监听的实例
2019/09/06 Javascript
详解JavaScript之ES5的继承
2020/07/08 Javascript
[04:41]2014DOTA2国际邀请赛 Liquid顺利突围晋级正赛
2014/07/09 DOTA
Python import自定义模块方法
2015/02/12 Python
Bottle框架中的装饰器类和描述符应用详解
2017/10/28 Python
Python安装图文教程 Pycharm安装教程
2018/03/27 Python
在pycharm中设置显示行数的方法
2019/01/16 Python
Emporio Armani腕表天猫官方旗舰店:乔治·阿玛尼为年轻人设计的副线品牌
2017/07/02 全球购物
C#面试常见问题
2013/02/25 面试题
实习教师自我鉴定
2013/09/27 职场文书
高中生的自我评价
2014/03/04 职场文书
经济管理专业求职信
2014/06/09 职场文书
毕业生找工作自荐书
2014/06/30 职场文书
2016入党积极分子党课培训心得体会
2016/01/06 职场文书
九年级数学教学反思
2016/02/17 职场文书
修改MySQL的数据库引擎为INNODB的方法
2021/05/26 MySQL
JS代码编译器Monaco使用方法
2021/06/11 Javascript
图片批量处理 - 尺寸、格式、水印等
2022/03/07 杂记