视频案例的实现

Original 2019-05-22 16:10:40 217
abstract:DOM的作用就是改变html元素的内容 ,如何操作就显得至关重要,通过既定的函数找到需要操作的元素,再改变他的内容,怎么找到这是需要深入理解和吃透的;<!DOCTYPE html><html><head> <title>javascript学习</title> <meta charset="utf-8">

DOM的作用就是改变html元素的内容 ,如何操作就显得至关重要,通过既定的函数找到需要操作的元素,再改变他的内容,怎么找到这是需要深入理解和吃透的;

<!DOCTYPE html>

<html>

<head>

<title>javascript学习</title>

<meta charset="utf-8">

<link rel="icon" type="image/x-icon" href="static/images/favicon.ico">

<!-- <script type="text/javascript" src="static/a.js"></script> -->

<style type="text/css">

    *{margin: 5px;padding: 0;}

#box{

margin:20px 40px;

width: 200px;

height: 200px;

border:0 2px 2px;

background: #000;

}

button{

width: 50px;

height: 20px;

}


</style>

<script type="text/javascript">


var box;

window.onload=function(){

box=document.getElementById('box');

}

function a(){

box.style.height="400px";

}

function b(){

box.style.width="400px";

}

function c(){

box.style.background="skyblue";

}

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>

</head>

<body>

<div>

<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>

</div>




</body>

</html>


Correcting teacher:查无此人Correction time:2019-05-23 13:18:58
Teacher's summary:完成的不错。js功能非常强大,要好好练习。继续加油。

Release Notes

Popular Entries