<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Keywords" content="关键字,关键词">
    <meta name="Description" content="描述和简介">
    <title>Title</title>
    <style type="text/css">
        *{margin:0;padding:0;}
        body,ul,li,ol,dl,dd,p,h1,h2,h3,h4,h5,h6{ margin:0;}
        a{text-decoration:none;}
        img{border:none;}
        ol,ul{list-style:none;}
        #box1{height:200px;width:200px;background:pink;}
        #box2{height:200px;width:200px;background:yellow;}
    </style>
</head>
<body>
<div id="box1"></div>
<div id="box2"></div>
<script>
    var xiaochui=document.getElementById("box2");
   　 var dachui=document.getElementById("box1");
       dachui.onmouseover=function(){
       this.innerHTML="我被碰了一下";
       xiaochui.innerHTML="box1正在被碰"
       };
       dachui.onmouseout=function(){
       this.innerHTML="我们都没被碰";
       xiaochui.innerHTML="我们都没被碰"
       };
       xiaochui.onmouseover=function(){
       this.innerHTML="我正在被碰";
       dachui.innerHTML="box2正在被碰"
       };
       xiaochui.onmouseout=function(){
       this.innerHTML="我们都没被碰";
       dachui.innerHTML="我们都没被碰"
       }

</script>
</body>
</html>

js onmouseover与onmouseout用法的更多相关文章

  1. JS:onmouseover 、onmouseout

    鼠标移动到P标签上时,改变文本和边框样式 <style type="text/css"> .onmouseover { color: red; border: 1px ...

  2. Js onmouseover和onmouseout小特效

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  3. JS事件之onmouseover 、onmouseout 与onmouseenter 、onmouseleave区别

    疫情过后回武汉的第一天打卡,今天偶然遇到一个问题onmouseover .onmouseout 与onmouseenter .onmouseleave这些事件的区别,也看了一些博客,感觉不是很清楚,所 ...

  4. 关于onmouseover和onmouseout的bug

    总结了一下关于使用onmouseover以及onmouseout会出现的bug 首先简单的布局: <div id="box"> <div>这是一个内容< ...

  5. onmouseover和onmouseout鼠标移入移出切换图片的几种实现方法

    鼠标移入移出图片切换很常见的,那我们就来说说他的写法 第一种方法,也是最简单的一种,在html:里就可实现 <img class="img" src="img/do ...

  6. [转载]js中return的用法

    一.返回控制与函数结果,语法为:return 表达式; 语句结束函数执行,返回调用函数,而且把表达式的值作为函数的结果 二.返回控制,无函数结果,语法为:return;  在大多数情况下,为事件处理函 ...

  7. js中this的用法

    经过近几周的模拟面试题,我查询了一些资料,今天就来说说,在js中this的用法吧.方法有四:第一,用作全局变量,第二,用作表该对象,第三,用作构造函数,第四,用作call和applay

  8. onmouseover和onmouseout的那些事

    这篇文章来自一个偶然...以前刚开始学习javascript事件的时候就被一个东西搞得晕头撞向的.就是一对名字很相近的事件.一组是onmouseover()和onmouseout().另一组就是onm ...

  9. JQuery之append和appendTo的区别，还有js中的appendChild用法

    JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...

随机推荐

  1. HDFS的接口（命令行接口和Java接口）--笔记

    HDFS 文件的系统访问的接口 1.Hadoop的shell命令脚本 hadoop fs -ls   列出某一个目录下的文件 hadoop fs -lsr 递归的方式列出所有文件 hadoop fs ...

  2. 英语学习笔记---01---新概念第一册---Lesson 1 Excuse me!

    Lesson 1   Excuse me!   [词汇] excuse [iks5kju:z]                      v. 原谅      劳驾.借光 me             ...

  3. NFS服务安装及配置

    服务器环境:CentOS6.9  Linux 2.6.32-696.el6.x86_64 安装NFS服务 nfs客户端和服务端都只需要安装nfs-utils包即可,并且yum安装时会连带安装rpcbi ...

  4. Lambda转sql部分代码保存

    public class SqlExpressionTree { public string GetQuerySql<T>(Expression<Func<T, bool> ...

  5. asp.net 自定义的模板方法接口通用类型

    本来想写这个帖子已经很久了,但是公司事情多,做着做着就忘记了.公司因为需要做接口,而且用的还是asp.net的老框架,使用Handler来做,没得办法,自己照着MVC写了一个通过的接口操作模板. 上送 ...

  6. 一起写框架-Ioc内核容器的实现-基础功能-ComponentScan支持多包扫描（六）

    实现功能 1.我们看到@ComponentScan注解一个开始定义就是需要支持,扫描多个包,将多个包的类名获取到.现在就实现这个功能. 实现思路 根据传入的字符串数组,获得多个包下的类全限制名. 实现 ...

  7. 高阶函数实现AOP

    AOP(面向切面程序)的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来,这些跟业务逻辑无关的功能通常包括日至统计.安全控制.异常处理等.把这些功能抽离出来之后,再通过"动态织入&quo ...

  8. C语言一些知识点回顾

    1.多行宏定义 #include <stdio.h> #define _PyObject_HEAD_EXTRA \ struct _object *_ob_next; \ struct _ ...

  9. Python手动实现k-means

    import numpy as np import matplotlib.pyplot as plt def kmeans(data, cluster_num, method='mean'): poi ...

  10. netty 入门二 （传输bytebuf 或者pojo）

    基于流的数据传输:在基于流的传输(如TCP / IP)中,接收的数据被存储到套接字接收缓冲器中. 不幸的是,基于流的传输的缓冲区不是数据包的队列,而是字节队列. 这意味着,即使您将两个消息作为两个独立 ...