摘要:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>javaScript控制div样式!!!</title> &
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javaScript控制div样式!!!</title>
<style>
*{margin: 0px;padding: 0px;}
#box{width: 100px;height: 100px;background-color:red;margin: 10px 50px; }
</style>
</head>
<body>
<div id="box">
</div>
<button onclick="a()">变高</button>
<button onclick="b()">变宽</button>
<button onclick="c()">变色</button>
<button onclick="d()">重置</button>
<button onclick="e()">隐藏</button>
<button onclick="f()">显示</button>
<script>
var box //声明变量
window.onload=function(){ //页面加载完整执行改函数 window是全局的意思
box=document.getElementById('box') //获取div的id然后赋值给变量box
}
function a(){
box.style.height="500px" //改变高度
}
function b(){
box.style.width="500px" //改变宽度
}
function c(){
box.style.background="blue" //改变颜色
}
function d(){
box.style.height="100px"
box.style.width="100px"
box.style.background="red"
}
function e(){
box.style.display="none" //隐藏
}
function f(){
box.style.display="block" //显示
}
</script>
</body>
</html>这节课是案例课运用了之前学到的知识有,用var关键字声明变量,变量的赋值,创建函数,全局变量在函数内部使用要加上window.变量名,最主要的是用到了javaScript中的事件。
总结这个真的不是很擅长--
批改老师:天蓬老师批改时间:2019-01-02 14:32:02
老师总结:var关键字声明变量,变量的赋值,创建函数, var 不能创建函数,他只是声明了一个变量,将一个函数的声明文本赋值给它, 就是一个函数表达式,声明函数只能用function funcName(){...}