javascript实现控制div颜色


Posted in Javascript onJuly 07, 2015

js控制div颜色

<html>
<head>
</head>
<style>
#div1{width:400px;height:400px;background-color:red;}
</style>
<script>
function blue(){
div1=document.getElementById('div1');
div1.style.backgroundColor='blue';
}
function pink(){ 
div1=document.getElementById('div1');
div1.style.backgroundColor='pink';
}
function black(){
div1=document.getElementById('div1');
div1.style.backgroundColor='black';
}

</script>
<body>
<button onclick='wr();'>生成文字</button>
<button onclick='blue();'>blue</button>
<button onclick='pink();'>pink</button>
<button onclick='black();'>black</button>
<div id='div1'>
</div>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
event.keyCode键码值表 附只能输入特定的字符串代码
May 15 Javascript
De facto standard 世界上不可思议的事实标准
Aug 29 Javascript
避免回车键导致的页面无意义刷新的解决方法
Apr 12 Javascript
解决js页面滚动效果scrollTop在FireFox与Chrome浏览器间的兼容问题的方法
Dec 03 Javascript
JavaScript添加随滚动条滚动窗体的方法
Feb 23 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
Jul 01 Javascript
vue 2.0项目中如何引入element-ui详解
Sep 06 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
Feb 09 Javascript
vue+axios新手实践实现登陆的示例代码
Jun 06 Javascript
jQuery实现获取及设置CSS样式操作详解
Sep 05 jQuery
vue 需求 data中的数据之间的调用操作
Aug 05 Javascript
浅谈JavaScript中的字符编码转换问题
Jul 07 #Javascript
JavaScript中判断两个字符串是否相等的方法
Jul 07 #Javascript
javascript中数组方法汇总
Jul 07 #Javascript
jQuery原型属性和原型方法详解
Jul 07 #Javascript
在JavaScript中访问字符串的子串
Jul 07 #Javascript
jQuery.each使用详解
Jul 07 #Javascript
JavaScript中字符串拼接的基本方法
Jul 07 #Javascript
You might like
让你同时上传 1000 个文件 (二)
2006/10/09 PHP
Smarty Foreach 使用说明
2010/03/23 PHP
php设计模式 Factory(工厂模式)
2011/06/26 PHP
mysql 查询指定日期时间内sql语句实现原理与代码
2012/12/16 PHP
一个完整的php文件上传类实例讲解
2015/10/27 PHP
JavaScript 指导方针
2007/04/05 Javascript
juqery 学习之四 筛选过滤
2010/11/30 Javascript
jquery里的正则表达式说明
2011/08/03 Javascript
NodeJS 模块开发及发布详解分享
2012/03/07 NodeJs
Javascript计算两个marker之间的距离(Google Map V3)
2013/04/26 Javascript
jquery scrollTop方法根据滚动像素显示隐藏顶部导航条
2013/05/27 Javascript
js动态给table添加/删除tr的方法
2013/08/02 Javascript
JS动态增删表格行的方法
2016/03/03 Javascript
javascript关于继承解析
2016/05/10 Javascript
Web打印解决方案之普通报表打印功能
2016/08/29 Javascript
Bootstrap Modal对话框如何在关闭时触发事件
2016/12/02 Javascript
获取IE浏览器Cookie信息的方法
2017/01/23 Javascript
jQuery简易时光轴实现方法示例
2017/03/13 Javascript
JavaScript数据结构之二叉树的计数算法示例
2017/04/13 Javascript
web前端vue filter 过滤器
2018/01/12 Javascript
微信小程序时间控件picker view使用详解
2018/12/28 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
2019/04/23 Javascript
详解微信小程序缓存--缓存时效性
2019/05/02 Javascript
[01:23]2019完美世界全国高校联赛(春季赛)合肥全国总决赛
2019/06/10 DOTA
Python cookbook(数据结构与算法)在字典中将键映射到多个值上的方法
2018/02/18 Python
python自动12306抢票软件实现代码
2018/02/24 Python
使用python3构建文件传输的方法
2019/02/13 Python
python实现QQ空间自动点赞功能
2019/04/09 Python
基于python调用psutil模块过程解析
2019/12/20 Python
用pytorch的nn.Module构造简单全链接层实例
2020/01/14 Python
使用HTML5 IndexDB存储图像和文件的示例
2018/11/05 HTML / CSS
GEOX鞋美国官方网站:意大利会呼吸的鞋
2017/07/12 全球购物
Marlies Dekkers内衣荷兰官方网店:荷兰奢侈内衣品牌
2020/03/27 全球购物
运动会广播稿200米
2014/01/27 职场文书
迎新晚会邀请函
2014/02/01 职场文书
《狼王梦》读后感:可怜天下父母心
2019/11/01 职场文书