<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<!--定义样式-->
<style type="text/css">
/*id选择器 定义div的大小 背景色*/
#div1{
width: 300px;
height: 200px;
background-color:cornflowerblue;
border: solid 1px black;
/*上边距*/
margin-top: 50px;
/*左边距*/
margin-left: 600px;
text-align: center; }
/*元素选择器*/
input{
width: 70px;
height: 50px;
margin-left: 20px;
color: red;
}
</style>
<script type="text/javascript">
//随机生成div新的位置
function random(){
//得到div
var div1=document.getElementById("div1");
//随机得到两个边距的值
var left=Math.random()*1200;
var top=Math.random()*500;
div1.style.marginLeft=left+"px";
div1.style.marginTop=top+"px"; }
//隐藏div并设置页面的背景图片
function test(){
//设置body的背景图片
document.body.style.backgroundImage="url(img/background.jpg)"
//隐藏
var div1=document.getElementById("div1");
div1.style.display="none";
}
</script>
</head>
<body>
<!--块-->
<div id="div1">
陶渊明去没去过桃花源?
<br /><br />
<input type="button" name="" id="" value="去过" onclick="test()" />
<!--当鼠标的位置 移动到‘没去过’按钮的时候 触发方法 重新生成div的位置-->
<input type="button" name="" id="" value="没去过" onmouseover="random()"/>
</div>
</body>
</html>

  

实训篇-JavaScript-陶渊明去没去过桃花源的更多相关文章

  1. 鸿蒙内核源码分析(静态站点篇) | 五一哪也没去就干了这事 | 百篇博客分析OpenHarmony源码 | v52.02

    百篇博客系列篇.本篇为: v52.xx 鸿蒙内核源码分析(静态站点篇) | 五一哪也没去就干了这事 | 51.c.h.o 前因后果相关篇为: v08.xx 鸿蒙内核源码分析(总目录) | 百万汉字注解 ...

  2. nmap扫描进阶、msfconsole攻击入门(网安全实训第二天)

    本期内容:nmap扫描.msfconsole攻击入门 1. nmap扫描进阶 2.msfconsole攻击入门 1.nmap扫描进阶 (1)nmap命令 nmap --sP -iL abin.txt ...

  3. $2019$各种$WC$没去记

    \(2019\)各种\(WC\)没去记 太弱了去不了啊. 至少我联赛没退役是吧...(退役感++ 不过这个分数线还是有点让人自闭啊,划线人绝对有毒,有人关照一下空巢老人\(mona\)喵? 这里大概是 ...

  4. Java企业实训 - 01 - Java前奏

    前言: 虽然个人专攻.NET方向,不过由于个人是干教育行业的,方方面面的东西,不能说都必须精通,但肯定多少都会涉及到. 一个菜鸟学员,从啥都不会,经过一步步学习,最后到企业上手掌管一个模块甚至一个项目 ...

  5. Android实训案例(八)——单机五子棋游戏,自定义棋盘,线条,棋子,游戏逻辑,游戏状态存储,再来一局

    Android实训案例(八)--单机五子棋游戏,自定义棋盘,线条,棋子,游戏逻辑,游戏状态存储,再来一局 阿法狗让围棋突然就被热议了,鸿洋大神也顺势出了篇五子棋单机游戏的视频,我看到了就像膜拜膜拜,就 ...

  6. JS相关实训

    今天又是无聊的一天,我的脑袋一直在嗡嗡叫,想着一些奇怪的问题,比如我为什么总是感到这么失落,为什么我喜欢的女孩不喜欢我呢,真是头大啊.不过既然有作业了我这个五好公民当然要认真写了.没时间让我思考这么复 ...

  7. <实训|第四天>Linux下的vim你真的掌握了吗?附上ftp远程命令上传。

    期待已久的linux运维.oracle"培训班"终于开班了,我从已经开始长期四个半月的linux运维.oracle培训,每天白天我会好好学习,晚上回来我会努力更新教程,包括今天学到 ...

  8. Android实训案例(四)——关于Game,2048方块的设计,逻辑,实现,编写,加上色彩,分数等深度剖析开发过程!

    Android实训案例(四)--关于Game,2048方块的设计,逻辑,实现,编写,加上色彩,分数等深度剖析开发过程! 关于2048,我看到很多大神,比如医生,郭神,所以我也研究了一段时间,还好是研究 ...

  9. Android实训案例(三)——实现时间轴效果的ListView,加入本地存储,实现恋爱日记的效果!

    Android实训案例(三)--实现时间轴效果的ListView,加入本地存储,实现恋爱日记的效果! 感叹离春节将至,也同时感叹时间不等人,一年又一年,可是我依然是android道路上的小菜鸟,这篇讲 ...

  10. HDFS集群PB级数据迁移方案-DistCp生产环境实操篇

    HDFS集群PB级数据迁移方案-DistCp生产环境实操篇 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 用了接近2个星期的时间,终于把公司的需要的大数据组建部署完毕了,当然,在部 ...

随机推荐

  1. kafka的消费

    1.消费方式 consumer 采用 pull(拉) 模式从 broker 中读取数据. push(推)模式很难适应消费速率不同的消费者,因为消息发送速率是由 broker 决定的. 它的目标是尽可能 ...

  2. day11-面向对象02

    面向对象02 7.继承 继承的本质是对某一批类的抽象,从而实现对现实世界更好地建模 extends的意思是"扩展".子类是父类的扩展. Java类中只有单继承,没有多继承!(一个儿 ...

  3. 3D渲染速度慢,花重金买显卡还是用云渲染更划算

    3D渲染对建筑师和设计师来说并不陌生,3D渲染的过程中出现渲染卡顿.特殊材质难以渲染,或者本地配置不足.本地渲染资源不够时,常常会影响工作效率.本文比较了3D渲染时,为提高工作效率,买显卡还是用云渲染 ...

  4. C#实时监测文件夹变化

    在开发各种应用程序时,我们经常需要对文件系统中的文件或文件夹进行实时监测,以便在文件内容改变.文件被创建或删除时能够及时做出反应.在 C# 中,System.IO.FileSystemWatcher ...

  5. 记录--为什么 export 导出一个字面量会报错,而使用 export default 就不会报错?

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 核心 其实总的来说就是 export 导出的是变量的句柄(或者说符号绑定.近似于 C 语言里面的指针,C++里面的变量别名),而 expo ...

  6. CSP:Object as Point同会议论文,相似思想用于人脸和行人检测 | CVPR 2019

    CSP将目标定义为中心点和尺寸,通过网络直接预测目标的中心和寸尺,相对于传统的RCNN类型检测算法轻量化了不少.整体思想与Object as Points撞车了,真是英雄所见略同   来源:晓飞的算法 ...

  7. KingbaseES V8R6 常用的系统函数

    查看当前日志文件lsn位置: select sys_current_wal_lsn(); 查看某个lsn对应的日志名: select sys_walfile_name('0/1162FBA0'); 查 ...

  8. 【已解决】(MySQL)SQL注入绕过登陆验证直接登陆---用户名输入框注释sql密码语句段

    今天学习了一种sql注入方法,通过注释密码验证部分的sql语句. 这是登陆界面 在用户名如果输入 15284206891' and 1=1 # 密码可以随意输入即可登陆成功 原理如下: 在sql可视化 ...

  9. CH392作服务器TCP Server应用配置使用

    CH392工作在TCP Server模式时,参考手册说明需要打开监听Socket端口,也要设置数据连接Socket端口,注意数据连接Socket的源端口和监听Socket的源端口一致. 配置TCP S ...

  10. #状压dp#JZOJ 3853 帮助Bsny

    题目 一共有\(n\)本书,混乱值是连续相同高度书本的段数. 可以取出\(k\)本书随意放回,问最小混乱值,高度\([25\sim 32]\) 分析 设\(f[i][j][k][mask]\)表示前\ ...