//鼠标移入移出动画 解决页面闪屏问题
window.onload = function () {
var el = document.createElement('div');
el.className = "bg";
var obj_lis = document.getElementsByTagName('a');
for (i = 0; i < obj_lis.length; i++) {
obj_lis[i].onmouseover = function (ev) {
var oEvent = ev || event;
var oFrom = oEvent.fromElement || oEvent.relatedTarget;
//其中oEvent.fromElement兼容IE,chrome
//oEvent.relatedTarget;兼容FF。
if (this.contains(oFrom)) return; //判断a是不是包含oFrom,如果包含就返回
//alert('移入了');
this.appendChild(el);
};
obj_lis[i].onmouseout = function (ev) {
var oEvent = ev || event;
var oTo = oEvent.toElement || oEvent.relatedTarget;
//其中oEvent.toElement兼容IE,chrome
//oEvent.relatedTarget;兼容FF。
if (this.contains(oTo)) return; //判断a是不是包含oTo,如果包含就返回
this.removeChild(el);
// alert('移出了');
};
}
}
//end鼠标移入移出动画

原生js获取子元素、给元素增加div的更多相关文章

  1. 原生js获取子元素

    感谢原文作者:归一山人 原文链接:https://www.cnblogs.com/guiyishanren/p/12214757.html 获取子元素的方法有 //获取第一个demo类 dom = d ...

  2. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  3. 原生js获取元素样式

    摘要: 我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class.现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置 在开始之 ...

  4. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  5. JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )

    1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...

  6. 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  7. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

  8. 原生JS获取HTML样式并修改

    大家都知道在JavaScript原生操作中获取元素的样式,在实际操作是使用时比较频繁的一件事,这里像大家介绍下获取css样式的方法,希望可以帮助一些需要的人,如果有幸被大牛看到,有更好的办法,欢迎提出 ...

  9. JS获取子节点、父节点和兄弟节点的方法实例总结

    转自:https://www.jb51.net/article/143286.htm 本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 ...

随机推荐

  1. [PGM] Markov Networks

    6 Markov Networks 系列 因果影响的独立性 noisy-or模型 和 广义线性模型 略,暂时不感兴趣. Pairwise Markov Networks The last col is ...

  2. checkmysql.sh

    #!/bin/sh # add by lxr MYSQL_SOCK="/tmp/mysql.sock" MYSQL_PWD="qq139547" ARGS=1 ...

  3. 【SpringCloud微服务实战学习系列】客户端负载均衡Spring Cloud Ribbon

    Spring Cloud Ribbon是一个基于HTTP和TCP的客户端负载均衡工具,它基于Netflix Ribbon实现.通过Spring Cloud的封装,可以让我们轻松地将面向服务的RES模板 ...

  4. JS正则校验

    /** 用途:检查输入字符串是否为空或者全部都是空格 输入:str:字符串 返回: 如果全是空返回true,否则返回false */ function isNull(str) { if (str == ...

  5. git 删除仓库的文件

    git移除远程仓库某个文件夹 1.比如src/product/ 文件夹 git rm -r --cached "src/product" //执行命令. 2.提交到本地 git c ...

  6. Orleans学习总结(一)--入门认识

    最近这段时间接触了些新的东西:Orleans框架.今天是春节前最后一天班,把我这段时间学习的东西总结一下分享给大家. 一.什么是Orleans (文档地址.这里我就直接翻译官方的介绍,有点地方翻译的有 ...

  7. Spring的标签和验证等模块

    使用了spring,真的可以简化很多开发,但前提是你懂spring技术,并且环境,架包没错. 今天编写了登录验证的模块,但是就是验证不了,不知道哪里出错了,但是也不好改错,这样还是很费时间的. 错误提 ...

  8. git rebase 操作撤销

    git rebase可以更改提交历史,在不影响别人的情况下,能够重整git树. 但如果git rebase操作失误,却在push后才发现,怎么撤销rebase操作呢? 使用git reflog + g ...

  9. 网络通信协议三之TCP/IP模型详解

    TCP/IP模型 注:PDU:Protocol Date Unit:表示对等层之间传递的数据单位 TCP:Transmission Control Protocol:传输控制协议 UDP:User D ...

  10. Android Studio 工具窗口浮动与布局恢复【申明:来源于网络】

    Android Studio 工具窗口浮动与布局恢复[申明:来源于网络] http://bbs.chinaunix.net/thread-4182438-1-1.html