新课:PHP零基础(CMS开发)教学!
立即报名JavaScript基础篇 ——了解js
JavaScript基础语法
标识符 算数运算符 赋值运算符
比较运算符 逻辑运算符
变量 变量的赋值及变量类型
JavaScript核心篇—条件控制语句
JavaScript核心篇—for循环语句
while循环与dowhile循环
多分支switch语句
字符串(string)操作函数
类型相互转换
JavaScript核心篇—数组(Array)
数组操作函数
JavaScript核心篇—函数(function)
变量的作用域
JavaScript核心篇—事件
JavaScript提升篇—HTMLDOM
JavaScript提升篇—改变CSS样式
Date(日期对象)
JavaScript控制DIV样式
JavaScrip-—t全选
微博输入字数(1)
微博输入字数(2)
吴雨7年前
改变div样式 先做个DIV 给个ID。box 添加一个样式,width height background:red margin:20px 80px; 做6个按钮 button value值 高、宽、变色、重置 隐藏、显示 插入script
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> #box{ width: 100px; height: 100px;background:red;margin: 20px 80px; } </style> </head> <body> <div id="box"></div> <input type="button" value="变高" onclick="aa()"> <input type="button" value="变宽" onclick="bb()"> <input type="button" value="变色" onclick="cc()"> <input type="button" value="重置" onclick="dd()"> <input type="button" value="隐藏" onclick="ee()"> <input type="button" value="显示" onclick="ff()"> <script type="text/javascript"> var box window.onload=function(){ box=document.getElementById('box') } function aa(){ box.style.height="400px" //改变高度 } function bb(){ box.style.width="400px" //改变宽度 } function cc(){ box.style.background="pink" //改变颜色 } function dd(){ box.style.height="100px" //改变颜色 box.style.width="100px" box.style.background="red" } function ee(){ box.style.display="none" } function ff(){ box.style.display="block" } </script> </body> </html>
0