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动态插入script的基本思路及实现函数
Nov 11 Javascript
js变量、作用域及内存详解
Sep 23 Javascript
Bootstrap3制作自己的导航栏
May 12 Javascript
jQuery使用each方法与for语句遍历数组示例
Jun 16 Javascript
Bootstrap中的表单验证插件bootstrapValidator使用方法整理(推荐)
Jun 21 Javascript
vue.js中created方法作用
Mar 30 Javascript
vue 权限认证token的实现方法
Jul 17 Javascript
vue实现表单录入小案例
Sep 27 Javascript
创建nuxt.js项目流程图解
Mar 13 Javascript
toString.call()通用的判断数据类型方法示例
Aug 28 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
Dec 11 Vue.js
Axios代理配置及封装响应拦截处理方式
Apr 07 Vue.js
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
如何在symfony中导出为CSV文件中的数据
2011/10/06 PHP
PHP改进计算字符串相似度的函数similar_text()、levenshtein()
2014/10/27 PHP
PHP CURL 多线程操作代码实例
2015/05/13 PHP
js 键盘记录实现(兼容FireFox和IE)
2010/02/07 Javascript
jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
2013/01/04 Javascript
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
2013/06/26 Javascript
JQuery筛选器全系列介绍
2013/08/27 Javascript
可选择和输入的下拉列表框示例
2013/11/05 Javascript
JS获取下拉列表所选中的TEXT和Value的实现代码
2014/01/11 Javascript
Iframe实现跨浏览器自适应高度解决方法
2014/09/02 Javascript
关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别
2015/10/12 Javascript
jQuery实现的给图片点赞+1动画效果(附在线演示及demo源码下载)
2015/12/31 Javascript
jQuery抛物线运动实现方法(附完整demo源码下载)
2016/01/08 Javascript
JavaScript鼠标特效大全
2016/09/13 Javascript
node中使用es5/6以及支持性与性能对比
2017/08/11 Javascript
javaScript动态添加Li元素的实例
2018/02/24 Javascript
ES6模板字符串和标签模板的应用实例分析
2019/06/25 Javascript
jQuery鼠标滑过横向时间轴样式(代码详解)
2019/11/01 jQuery
在Python中操作字符串之startswith()方法的使用
2015/05/20 Python
一键搞定python连接mysql驱动有关问题(windows版本)
2016/04/23 Python
详解python3 + Scrapy爬虫学习之创建项目
2019/04/12 Python
tensorflow 只恢复部分模型参数的实例
2020/01/06 Python
利用Tensorboard绘制网络识别准确率和loss曲线实例
2020/02/15 Python
浅谈selenium如何应对网页内容需要鼠标滚动加载的问题
2020/03/14 Python
Keras 利用sklearn的ROC-AUC建立评价函数详解
2020/06/15 Python
matplotlib阶梯图的实现(step())
2021/03/02 Python
韩国三星旗下的一家超市连锁店:Home Plus
2016/07/30 全球购物
美国最大的骑马用品零售商:HorseLoverZ
2017/01/12 全球购物
大学军训感想
2014/02/12 职场文书
绿色出行口号
2014/06/18 职场文书
群众路线查摆问题整改措施
2014/10/10 职场文书
简易离婚协议书范本2014
2014/10/15 职场文书
学术会议开幕词
2016/03/03 职场文书
2019年教师入党申请书
2019/06/27 职场文书
python基础之错误和异常处理
2021/10/24 Python
Mysql将字符串按照指定字符分割的正确方法
2022/05/30 MySQL