前端切图|点击按钮div变色
![](https://upload-images.jianshu.io/upload_images/5640239-00896ab65d6a9e35.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/337)
![](https://upload-images.jianshu.io/upload_images/5640239-d687d235380c9230.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/322)
<!DOCTYPE html>
<html>
<head>
<title>点击按钮div变色.html</title>
<meta charset="utf-8" />
</head>
<body>
<!--点击改变当前div的颜色,所以要给onclick这个事件的函数传递当前的对象即可-->
<div style="width:300px;height:30px;padding-top:10px;background:#3bb4f2;" onclick="changeColor(this)">
开始
</div>
</body>
<script>
//这个事件的目的是:当我们点击时要怎么处理
function changeColor(obj)
{
//因为JS会把HTML标签当做一个对象
//对象.属性 = 值;
obj.style.background = 'pink';
}
</script>
</html>
本专题记录平时项目中一些最基础简单的实现代码和容易忽略的细节,仅仅是为了记录,对于自己来说,基础是最重要的,一个项目就是由无数的基础组成。
注:
关注「编程微刊」公众号 ,在微信后台回复「领取资源」,获取IT资源300G干货大全。原文作者:祈澈姑娘技术博客:https://www.jianshu.com/u/05f416aefbe1
90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。
公众号回复“1”,拉你进程序员技术讨论群.