<!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. 安装Windows Azure Powershell

    本文将介绍如何安装Windows Azure Powershell 1.打开Azure官方链接:https://www.azure.cn/downloads/ 2.按照向导进行安装 3.打开系统自带的 ...

  2. 有道云翻译接口 Show类

    package com.yangchong.fanyi; import java.awt.EventQueue;import java.awt.Toolkit; import javax.swing. ...

  3. C# Post和Get请求

    Get请求: /// <summary> /// 调用ToxyzAPI /// </summary> /// <param name="requetid&quo ...

  4. G彩娱乐网【分享】想要开源自己的代码可以参考一下

    作为一个开发者,如果你打算开源自己的代码,千万不要忘记,选择一种开源许可证(license). 许多开发者对开源许可证了解很少,不清楚有哪些许可证,应该怎么选择.本文介绍开源许可证的基本知识,主要参考 ...

  5. 快速学会使用Fiddler抓包 截包伪造提交包

    1.Fiddler介绍 Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑,移动设备和互联网之间的http通讯,设置断点,查看所有的"进出"Fiddler的 ...

  6. 15.javaweb XML详解教程

    一.XML语言简介 1,  作用:用于描述和保存现实中具有某种关系的数据,还可以作为软件配置文件,和描述程序模块之间的关系 2,  语法: 首先 先看一个XML文件的组成部分 关于文档声明 Versi ...

  7. iOS 从实际出发理解多线程

    前言 多线程很多开发者多多少少相信也都有了解,以前有些东西理解的不是很透,慢慢的积累之后,这方面的东西也需要自己好好的总结一下.多线程从我刚接触到iOS的时候就知道这玩意挺重要的,但那时也是能力有限, ...

  8. [转发]读取txt防止读到乱码--自动根据文件编码进行读取

    以下是摘抄 /// <summary> /// 获取文件的编码格式 /// </summary> public class EncodingType { /// <sum ...

  9. bzoj1003

    考虑dp[i]表示前i天的最小总成本. 枚举上一次在第j天之后对路线进行了修改,那么就由dp[j]转移至dp[i],转移的代价是把第[j+1,i]天所有被占用的点全删掉后的最短路(不连通当然就是INF ...

  10. [转]DBCC (Transact-SQL)

    http://msdn.microsoft.com/zh-cn/library/ms188796.aspx Transact-SQL 编程语言提供 DBCC 语句以作为 SQL Server 的数据库 ...