A.了解js
1 点击事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
div{
width: 100px;
height: 100px;
background: red;
}
</style>
</head>
<body>
<div id="demo"></div>
<script type="text/javascript">
// 获取元素通过ID的方式
var a = document.getElementById("demo")
// 绑定这个点击事件
// (绑定点击事件,然后执行)
a.onclick = function () {
// 执行的任务
a.style.width="200px";
a.style.height="200px";
a.style.background="yellow"
}
</script>
</body>
</html>
!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<input type="text" id="int" value="我是文本框 来点我">
<input type="button" id="btn" value="点击弹出文本框内容">
<script type="text/javascript">
// 获取事件
var a = document.getElementById("int");
var b = document.getElementById("btn");
b.onclick=function(){
alert(a.value)
}
</script>
</body>
</html>
3 .onmouseover
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
padding: 0;
margin:0;
}
div{
width: 200px;
height: 100px;
background:red;
}
</style>
</head>
<body>
<input type="button" id="btn" value="碰我你就消失">
<div id="dd">
</div>
<script type="text/javascript">
var a= document.getElementById("dd");
var b= document.getElementById("btn");
var c="none"
d="block"
b.onmouseover=function(){
a.style.display= c;
var e=c;
c=d;
d= e
}
</script>
</body>
</html>
B.
C.
laoshizhenrangrenshiwang
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。