css部分
html,body{
width:100%;
height:100%;
}
html 部分
<input type="botton"value="点我变红"
onclick="document.body.style.background='red'">
注释内容
- input是一个标签,type="botton"指它是这个按钮的内容
- onclick是点击,点击后执行后面的代码
- style是样式,background是背景
版本二(函数式写法)
css部分
html,body{
width:100%;
height:100;
}
html 部分
<button id ="redBtn">红色<[图片上传失败...(image-48fee8-1606735950330)]
tton>
JS部分
var redBan = document.getElementByld("redBth");
redBtn.onclick = function(){
document.body.style.background ="red"
}
注释内容
- var redBtn 是声明一个变量,相当于给按钮起个名字存起来
- 我们吧要执行的代码放在function中存起来
- 当我们点击这个按钮的时候,才会执行function中的代码