Javascript实现"点按钮出随机背景色的"三个DIV
<!DOCTYPE html>
<html>
<head>
<title>Random_Color-Transformation</title>
<style type="text/css">
.div1{
height: 50px ;
width: 320px;
background-color: red;
font-size: 0.5em;
font-weight: bold;
font-style: italic;
text-decoration: underline;
}
.div2{
height: 50px ;
width: 320px;
background-color: yellow;
font-size: 1em;
font-weight: bold;
font-style: italic;
text-decoration: underline;
}
</style>
<style type="text/css">
.div3{
height: 50px ;
width: 320px;
background-color: green;
font-size: 2em;
font-weight: bolder;
font-style: oblique;
}
</style>
</head>
<body>
<div class = "div1" id="00">
Some contents here!
</div>
<input type="button" value="00" onclick = "getBgColor(this);" />
<div class = "div2" id="01">
Some contents here!
</div>
<input type="button" value="01" onclick = "getBgColor(this);" />
<div class = "div3" id="10">
Some contents here!
</div>
<input type="button" value="10" onclick = "getBgColor(this);" />
</body>
<script type="text/javascript">
function getBgColor(t){
var myDiv = document.styleSheets[t.value.substring(0,1)].cssRules[t.value.substring(1,2)].style.backgroundColor;
alert(myDiv);
var a = Math.floor(255*Math.random()) + '';
var b = Math.floor(255*Math.random()) + '';
var c = Math.floor(255*Math.random()) + '';
document.styleSheets[t.value.substring(0,1)].cssRules[t.value.substring(1,2)].style.backgroundColor = 'rgb(' + a + ',' + b + ',' + c + ')';
}
</script>
</html>
Javascript实现"点按钮出随机背景色的"三个DIV的更多相关文章
- iOS之按钮出现时加一个动画效果
//按钮出现时的动画效果 + (void)buttonAnimation:(UIButton *)sender { CAKeyframeAnimation *animation = [CAKeyfra ...
- JavaScript点击按钮显示 确认对话框
//JavaScript点击按钮显示确认对话框 <html xmlns="http://www.w3.org/1999/xhtml"> <head> < ...
- Javascript&Ajax-深入浅出JSONP--解决ajax跨域问题
Javascript&Ajax-深入浅出JSONP--解决ajax跨域问题 原理讲解: 链接地址:http://www.cnblogs.com/chopper/archive/2012/03/ ...
- JS控制语句 编程练习 学生数据,分别是姓名、性别、年龄和年级,接下来呢,我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦。
编程练习 在一个大学的编程选修课班里,我们得到了一组参加该班级的学生数据,分别是姓名.性别.年龄和年级,接下来呢,我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦. 学生信息如下 ...
- javaScript 删除事件 弹出确认 取消对话框
javaScript 删除事件 弹出确认 取消对话框 1. <a href="javascript:if(confirm('确实要删除?'))location='http://www. ...
- CSS实现按钮点击后根据背景色加深效果-一颗优雅草bigniu
具体代码如下 button{ position: relative; } button:active::before { display: block; content: ''; position: ...
- 使用 JavaScript自定义函数计算出教室的体积大小,其中教室的长、宽、高分别为 8 米、5 米、3 米
查看本章节 查看作业目录 需求说明: 使用 JavaScript自定义函数计算出教室的体积大小,其中教室的长.宽.高分别为 8 米.5 米.3 米 实现思路: 创建 HTML 页面 在页面的 < ...
- javascript实现掉落弹出层------Day29
顾名思义.所谓"掉落弹出层".就是出现一个弹出层,而出现的位置是从上方向下掉落.掉落到指定的位置停止,这样分析起来.和"右下角弹出提醒对话框"比起来,确有异曲同 ...
- JavaScript判断图片是否加载完成的三种方式
JavaScript判断图片是否加载完成的三种方式 有时需要获取图片的尺寸,这需要在图片加载完成以后才可以.有三种方式实现,下面一一介绍. 一.load事件 1 2 3 4 5 6 7 8 9 10 ...
随机推荐
- 说说C# 8.0 新增功能Index和Range的^0是什么?
前言 在<C# 8.0 中使用 Index 和 Range>这篇中有人提出^0是什么意思?处于好奇就去试了,结果抛出异常.查看官方文档说^0索引与 sequence[sequence.Le ...
- Mybatis参数预编译
Mybatis参数预编译 一.数据库预编译介绍 1.数据库SQL语句编译特性: 数据库接受到sql语句之后,需要词法和语义解析,优化sql语句,制定执行计划.这需要花费一些时间.但是很多情况,我们的一 ...
- smtplib.py
def _print_debug(self, *args): if self.debuglevel > 1: print(datetime.datetime.now().time(), *arg ...
- ensure that both new and old access_token values are available within five minutes, so that third-party services are smoothly transitioned.
WeChat public doc https://developers.weixin.qq.com/doc/offiaccount/en/Basic_Information/Get_access_t ...
- (007)每日SQL学习:将字符和数字分离
with aa as ( select 'sad10' as data from dual union all select 'datf20' as data from dual union all ...
- LOJ10065 北极通讯站
Waterloo University 2002 北极的某区域共有 n 座村庄,每座村庄的坐标用一对整数 (x,,y) 表示.为了加强联系,决定在村庄之间建立通讯网络.通讯工具可以是无线电收发机,也可 ...
- sudo 配置
在ubuntu中由于禁用了root用户,默认情况下会把安装系统时建立的用户添加到sudoers中. 但在redhat和centos中并没有把任何root用户之外的用户默认的添加到sudoers之中.这 ...
- 5.DHCP新建作用域及添加地址保留(Windows2012)
1.新建作用域 右键IPv4 点击新建作用域 点击下一步 命名,下一步 填写子网,下一步 在上一步已经预留了,直接点下一步即可. 设置租用期限,建议为3天,下一步. 下一步,配置DHCP选项 配置默认 ...
- TypeScript中 typeof ArrayInstance[number] 剖析
假设这样一个场景,目前业务上仅对接了三方支付 'Alipay', 'Wxpay', 'PayPal', 实际业务 getPaymentMode 会根据不同支付方式进行不同的付款/结算流程. const ...
- git从安装到多账户操作一套搞定(一)入门使用
作者:良知犹存 转载授权以及围观:欢迎添加微信:Allen-Iverson-me-LYN 总述 GIT是当今热门代码管理技术,但是如此火的系统,竟然是大神林纳斯花了两周用C写出来的一个分布式版 ...