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

注: 获取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);
}

(0)

相关推荐

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

    注: 获取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 =

  • 原生js封装运动框架的示例讲解

    昨天我们说了一下原生JS中常用的兼容性写法,今天我们来说一下运动框架. 正常情况下我们要写一个运动的效果会用到tween.js这么一个插件,这个东西不是一般人写出来的,因为里面涉及的运动效果都是经过一堆数学的函数运算出来的,我们平常人是写不出来的,所有我们就自己封装一个运动框架,有什么问题改起来也方便,下面我们就开始封装. 首先,我们先写一个div,设置一些简单的样式,我们就拿这个div举例子 如下代码: #div{ width: 100px; height: 100px; background

  • 使用D3.js创建物流地图的示例代码

    本文介绍了使用D3.js创建物流地图的示例代码,分享给大家,具体如下: 示例图 制作思路 需要绘制一张中国地图,做为背景. 需要主要城市的经纬坐标,以绘制路张起点和终点. 接收到物流单的城市,绘制一个闪烁的标记. 已经有过物流单的目标城市,不再绘制路线. 每次新产生一笔物流单,都有一个标记沿路线移向目标的动画效果. 绘制结束后的数据,需要清理掉,以减少对浏览器的资源占用. 开始撸码 1.创建网页模板 加载D3JS,为了方便调试,直接下载d3.js文件在本地,实际使用的时候,可以换成加载路径.注意

  • php+js实现点赞功能的示例详解

    最近在做一个视频网站,需要实现视频的点赞功能,我是结合ajax和数据库实现的,数据库的格式为有四个字段:文章id,赞,踩,ip.因为需要一个ip只能点赞一次,所以需要一个ip字段存储点赞的ip,这样便于判断该ip是否已经点赞过了: 我将点赞和踩的图片做成两个按钮:具体代码如下: <button style="margin-left:4px" id="vote" rel="<?php echo 文章id;?>"> <i

  • python和node.js生成当前时间戳的示例

    Python # coding=utf-8 import time import sys def func(): # 格式化输出时间 s1 = int(time.strftime("%Y%m%d%H%M%S", time.localtime())) # 时间戳,由于默认是秒需要转换为毫秒输出 s2 = int(round(time.time() * 1000)) return s1, s2 def once(): '''如果没有指明命令行参数则运行一次''' s1, s2 = func

  • js实现磁性吸附的示例

    磁性吸附 目录 代码实例 与限定范围拖拽的差异 下载源码链接 代码实例 * { padding: 0; margin: 0; } #box1 { width: 500px; height: 500px; background: #999; position: relative; left: 100px; top: 100px; } #box { width: 100px; height: 100px; background: #334; position: absolute; cursor: m

  • js实现自定义滚动条的示例

    自定义滚动条 目录 代码实例 代码解析 下载源码链接 代码实例 * { padding: 0; margin: 0; } #box1 { width: 500px; height: 20px; background: #999; position: relative; margin: 20px auto; } #box2 { width: 20px; height: 20px; background: green; position: absolute; } #box3 { width: 0;

  • js实现Element中input组件的部分功能并封装成组件(实例代码)

    现在实现的有基础用法.可清空.密码框,参考链接:https://element.eleme.cn/#/zh-CN/component/input HTML代码:想要测试哪个组件,直接将对应组件解开注释即可,标红的js和css记得修改成你自己的位置. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js实现可清空input组件</title> &

  • web项目开发之JS函数防抖与节流示例代码

    目录 防抖 引入 防抖场景1(鼠标移入) 防抖场景2(键盘按键) 函数节流 防抖 经典应用常见: 手风琴效果 引入 没有做防抖的网站: 做了防抖的网站: 防抖场景1(鼠标移入) 抖动 : 用户本来不想触发这个交互,但是由于鼠标不小心抖动误触发交互事件. 例子: 想看第五张图片,.不想看2 3 4张. 但是鼠标从第1张滑到第五张时候,不小心放在了2 3 4上面.误触发. 函数防抖 : 用户连续多次触发某个事件,则只执行最后一次. 解决原理: 开启定时器,间隔时间内如果多次触发事件,则每一次都清除上

  • JS+CSS绘制棋盘格的示例代码

    目录 实现思路 完整代码 效果展示 在这篇文章中,我将展示如何使用 css 和一些 JavaScript 来设计棋盘. 为此,你需要对 CSS Flex-box 和 nth-child() 属性有基本的了解. 所以让我们开始吧...... 实现思路 我们将为每个偶数行添加 containerEven 类作为父容器,为每个奇数行添加 containerOdd, 下面显示了相同的 CSS .containerEven>div:nth-child(odd) { background-color: wh

随机推荐