JS0热身运动
热身热身小知识点:
JS中如何获取元素:
1 通过ID名称来获取:document get element by id -->document.getElementById()
2
....
事件:鼠标事件,键盘事件,系统事件,表单事件,自定义事件...
onclick
onmouseover
onmouseout
onmousedown
onmouseup
onmousemove 就像是鼠标抚摸一样的事件
...
onload 加载以后执行...
window.onload=事情
如何添加事件:
元素.onmouseover
函数:可以理解为-命令,做些事——
function jill1231(){ //肯定不会主动执行的!
...
}
1 直接调用:jill1231();
2 事件调用:元素.事件=函数名oDiv.onclick=jill1231;
function(){} //匿名函数
元素.事件=function(){};
测试:
alert(1); 带一个确定按钮的警告框
alert('ok'); 'ok' "ok" 字符串
变量:
var num=123;
希望把某个元素移除你的视线:
1 display:none;
2 visibility:hidden;
3 width/height
4 opacity
5 拿一个div盖住它
...
例如,做一个菜单栏,鼠标移入,显示子菜单,移出,子菜单消失
<!DOCTYPE HTML>
<html>
<head>
<meta content="text/html;charset=utf-8">
<title>模拟菜单栏</title>
<style>
//reset
body,ul,li{margin:;padding:;}
ul,li{list-style:none;}
a{text-decoration:none;}
//main.css
.lis{width:80px;height:30px;border:1px solid #333;position:relative;}
.lis a{display:block;line-height:30px;text-align:center;color:#000;background:#f1f1f1;}
ul ul{width:80px;border:1px solid #333;position:absolute;top:30px;left:-1px;background:#ff9;display:none;}
ul ul li{text-align:center;line-height:30px;}
</style>
</head>
<body>
<ul>
//设置父级,保证鼠标移入移出伪元素及子级不出现闪退
<li id="lis">
<a hred="#" id="link">博客</a>
<ul id="ul1">
<li>私信</li>
<li>评论</li>
<li>@我</li>
</ul>
</li>
</ul>
<script>
var li=document.getElementById('lis');
var a=document.getElementById('link');
var ul=document.getElementById('ul1');
li.onmouseover=show;
li.onmouseout=hide; function show(){
ul.style.display='block';
a.style.background='#345345';
}
function hide(){
ul.style.display='none';
a.style.background='#f1f1f1';
}
</script>
</body>
</html>
JS0热身运动的更多相关文章
- Android逆向进阶——让你自由自在脱壳的热身运动(dex篇)
本文作者:HAI_ 0×00 前言 来看看我们今天的主题. 让你自由自在脱壳的热身运动. 现在很多第厂家都是使用第三方的加固方式来进行加固的.或者使用自己的加固方式进行加固. 那么我们必不可少的就是脱 ...
- [妙味JS基础]JS热身运动
知识点总结 获取ID元素 document.getElementById(' ') 事件:鼠标事件.键盘事件.系统事件.表单事件.自定义事件 onclick onmouseout onmouseove ...
- AI之旅(1):出发前的热身运动
前置知识 无 知识地图 自学就像在海中游泳 当初为什么会想要了解机器学习呢,应该只是纯粹的好奇心吧.AI似乎无处不在,又无迹可循.为什么一个程序能在围棋的领域战胜人类,程序真的有那么聪明吗?如 ...
- 妙味远程课堂-JS热身运动-上
希望某个元素移除视线 display:none//显示无 visibility:hidden//可见性 隐藏 width/height 改为0 透明度 定位,left/top值为负值 用与背景颜色一样 ...
- TensorFlow——热身运动:简单的线性回归
过程: 先用numpy建立100个数据点,再用梯度下滑工具来拟合,得到完美的回归线. # _*_coding:utf-8_*_ import tensorflow as tf import numpy ...
- 一生伏首拜阳明------<明朝那些事儿>
一生伏首拜阳明. 王守仁,字伯安,别号阳明. 成化八年(1472),王守仁出生在浙江余姚,大凡成大事者往往出身贫寒,小小年纪就要上山砍柴,下海捞鱼,家里还有几个生病的亲属,每日以泪洗面.这差不多也是惯 ...
- CPU与内存的那些事
下面是网上看到的一些关于内存和CPU方面的一些很不错的文章. 整理如下: 转: CPU的等待有多久? 原文标题:What Your Computer Does While You Wait 原文地址: ...
- 7 天玩转 ASP.NET MVC — 第 1 天
0. 前言正如标题「7 天玩儿转 ASP.NET MVC」所言,这是个系列文章,所以将会向大家陆续推出 7 篇.设想一下,一天一篇,你将从一个愉快的周一开始阅读,然后在周末成为一个 ASP.NET M ...
- Android开源框架——Picasso
开篇——介绍Picasso (Picasso是什么?)Picasso:A Powerfull Image Downloading and Caching Library for Android,即An ...
随机推荐
- Hadoop开发环境搭建
hadoop是一个分布式系统基础架构,由Apache基金会所开发. 用户可以在不了解分布式底层细节的情况下,开发分布式程序.充分利用集群的威力高速运算和存储. Hadoop实现了一个分布式文件系统 ...
- 一个优秀的http实现框架
package com.ming; import com.mashape.unirest.http.HttpResponse; import com.mashape.unirest.http.Unir ...
- android:layout_weight详解
参考; www.cnblogs.com/alpha-bowen/archive/2011/03/02/1969343.html 总结: 当需要对页面按比例分配时会用到这个选项: layout_weig ...
- 检查并创建目录mkdir
os.listdir() os.path.isdir() os.path.join() os.mkdir() # -*- coding:utf-8 -*- import os,sys def mkdi ...
- Linux的线程同步对象:互斥量Mutex,读写锁,条件变量
进程是Linux资源分配的对象,Linux会为进程分配虚拟内存(4G)和文件句柄等 资源,是一个静态的概念.线程是CPU调度的对象,是一个动态的概念.一个进程之中至少包含有一个或者多个线程.这 ...
- ASP.NET MVC 4 RC的JS/CSS打包压缩功能 (转载)
ASP.NET MVC 4 RC的JS/CSS打包压缩功能 打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载 ...
- 【http】
var qs = require('querystring') require('http').createServer(function(req, res) { //res.writeHead(20 ...
- VM Depot 登陆中国!
发布于 2014-03-24 作者 陈 忠岳 今天我很高兴地向大家宣布,来自微软开放技术(上海)有限公司的首个产品 VM Depot 正式在中国发布!VM Depot是为Windows Azur ...
- win7+ubuntu 13.04双系统安装方法
转自:http://jingyan.baidu.com/article/60ccbceb18624464cab197ea.html 当需要频繁使用ubuntu时,vmware虚拟机下运行ubuntu, ...
- Entity Framework快速入门笔记—增删改查
第一步:创建一个控制台应用程序,起名为EFDemo 2. 第二步:创建一个实体模型 (1)在EFDemo项目上面右击选择添加—新建项—在已安装的选项中选择数据—ADO.NET实体对象模型,如图所示: ...