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写的一个自定义弹出式对话框代码
Jan 17 Javascript
JQuery跨Iframe选择实现代码
Aug 19 Javascript
JavaScript之编码规范 推荐
May 23 Javascript
js控制的回到页面顶端goTop的代码实现
Mar 20 Javascript
javascript预加载图片、css、js的方法示例介绍
Oct 14 Javascript
使用apply方法实现javascript中的对象继承
Dec 16 Javascript
浅析JavaScript基本类型与引用类型
May 28 Javascript
jquery对象和javascript对象即DOM对象相互转换
Aug 07 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 Javascript
手机移动端实现 jquery和HTML5 Canvas的幸运大奖盘特效
Dec 06 Javascript
jQuery事件详解
Feb 23 Javascript
基于JavaScript实现的折半查找算法示例
Apr 14 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设计模式 Composite (组合模式)
2011/06/26 PHP
解析php curl_setopt 函数的相关应用及介绍
2013/06/17 PHP
php猴子选大王问题解决方法
2015/05/12 PHP
php获取、检查类名、函数名、方法名的函数方法
2015/06/25 PHP
[原创]php简单隔行变色功能实现代码
2016/07/09 PHP
Thinkphp实现站点静态化的方法详解
2017/03/21 PHP
yii2.0整合阿里云oss的示例代码
2017/09/19 PHP
Laravel框架Request、Response及Session操作示例
2019/05/06 PHP
PHP数组与字符串互相转换实例
2020/05/05 PHP
javascript 学习之旅 (3)
2009/02/05 Javascript
js 利用image对象实现图片的预加载提高访问速度
2013/03/29 Javascript
jQuery中hide()方法用法实例
2014/12/24 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
2016/01/26 Javascript
模仿password输入框的实现代码
2016/06/07 Javascript
element-ui使用导航栏跳转路由的用法详解
2018/08/22 Javascript
javascript匿名函数中的'return function()'作用
2018/10/15 Javascript
小程序实现人脸识别功能(百度ai)
2018/12/23 Javascript
Vue基础学习之项目整合及优化
2019/06/02 Javascript
小程序如何在不同设备上自适应生成海报的实现方法
2019/08/20 Javascript
ant-design-vue中tree增删改的操作方法
2020/11/03 Javascript
在Apache服务器上同时运行多个Django程序的方法
2015/07/22 Python
在pandas中一次性删除dataframe的多个列方法
2018/04/10 Python
Python Numpy:找到list中的np.nan值方法
2018/10/30 Python
详解Python是如何实现issubclass的
2019/07/24 Python
Django Form 实时从数据库中获取数据的操作方法
2019/07/25 Python
python 使用递归回溯完美解决八皇后的问题
2020/02/26 Python
pytorch简介
2020/11/11 Python
基于CSS3 animation动画属性实现轮播图效果
2017/09/12 HTML / CSS
美国户外生活方式品牌:Eddie Bauer
2016/12/28 全球购物
韩国演唱会订票网站:StubHub韩国
2019/01/17 全球购物
执行总经理岗位职责
2014/02/03 职场文书
幸福家庭事迹材料
2014/02/03 职场文书
锅炉工岗位职责
2015/02/13 职场文书
2015年房地产销售工作总结
2015/04/20 职场文书
父亲去世追悼词
2015/06/23 职场文书
springboot读取resources下文件的方式详解
2022/06/21 Java/Android