运行效果:

源代码:

 1 <!DOCTYPE html>
2 <html lang="zh">
3 <head>
4 <meta charset="UTF-8">
5 <title>改变背景颜色</title>
6 </head>
7 <body>
8 <div style="margin-top: 100px;margin-left: 100px;">
9 <button type="button" onclick="ChangeBackgroundColor('red')">红</button>
10 <button type="button" onclick="ChangeBackgroundColor('blue')">蓝</button>
11 <button type="button" onclick="ChangeBackgroundColor('green')">绿</button>
12 </div>
13
14 <script type="text/javascript">
15 function ChangeBackgroundColor(new_bgcolor) {
16 document.bgColor = new_bgcolor;
17 }
18 </script>
19 </body>
20 </html>

JavaScript实现按钮改变网页背景色的更多相关文章

  1. 点击按钮改变div背景色,再次点击恢复 -- 原生JS

    如果对您有帮助,记得点个赞哦!

  2. Javascript技巧实例精选(1)—鼠标选择动态改变网页背景颜色

    >>点击这里下载html源文件代码<< 采用Javascript实现,用鼠标点击相应颜色,动态改变网页背景颜色 这是截图 相应的Javascript源代码为: var hex ...

  3. JavaScript HTML DOM - 改变CSS

    JavaScript HTML DOM - 改变CSS HTML DOM 允许 JavaScript 改变 HTML 元素的样式. 改变 HTML 样式 如需改变 HTML 元素的样式,请使用这个语法 ...

  4. js根据浏览器窗口大小实时改变网页文字大小

    目前,有了css3的rem,给我们的移动端开发带来了前所未有的改变,使得我们的开发更容易,更易兼容很多设备,但这个不在本文讨论的重点中,本文重点说说如何使用js来实时改变网页文字的大小. 代码: &l ...

  5. javascript和swf在网页中交互的一些总结

    Javascript和swf在网页中交互一般可有以下几种情况: 1.swf和这些调用的javascript在同域 2.swf和这些调用的javascript在不同域,比如加载远程的swf然后call别 ...

  6. JavaScript文件应该放在网页的什么位置

    JavaScript文件应该放在网页的什么位置 http://www.lihuai.net/qianduan/js/352.html 在<良好的JavaScript编程习惯>系列教程的第三 ...

  7. JavaScript HTML DOM - 改变 HTML

    JavaScript HTML DOM - 改变 HTML HTML DOM 允许 JavaScript 改变 HTML 元素的内容. 改变 HTML 输出流 JavaScript 能够创建动态的 H ...

  8. JavaScript插件——按钮

    Bootstrap3.0学习第二十四轮(JavaScript插件——按钮)   前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/ ...

  9. C#TreeView节点选中后失去焦点时改变节点背景色

    C#TreeView节点选中后失去焦点时改变节点背景色 在使用TreeView控件时候,单击一个节点,当鼠标聚焦到别的地方的时候,之前点击的这个节点就看不清楚了 举例截图 单击后           ...

随机推荐

  1. Jmeter--由PV估算tps和最大并发数

    需求 "假设一个系统的业务有登录.浏览帖子.发送新贴.回复帖子,访问高峰是上午10点,日访问高峰PV约5208(含登录1300.浏览2706.发帖526.回帖676).系统响应时间要求小于3 ...

  2. 面试官:Redis中哈希数据类型的内部实现方式是什么?

    面试官:Redis中基本的数据类型有哪些? 我:Redis的基本数据类型有:字符串(string).哈希(hash).列表(list).集合(set).有序集合(zset). 面试官:哈希数据类型的内 ...

  3. python的数据结构和基本语法

    1.支持的数据类型 str(字符串类型).int(整型).flout(浮点型).bool(逻辑值).complex(复数[数学上的]).bytes(字节型).list(列表).tuple(元组[不可以 ...

  4. 01 简介 如何高效的学习Java

    JavaSE 千寻简学习笔记 简介 TIOBE:编程语言排行榜 官网:https://hellogithub.com/report/tiobe/ 如何高效的学习Java 多写(代码)多写(笔记)多写( ...

  5. SqlServer Split 的实现

    数据库如何处理传参用指定字符隔开参数的情况 如"name1,name3,name5" 共2种方式, 1.数据库内置函数STRING_SPLIT(sql2016之前的版本不支持该函数 ...

  6. 5月31日 python学习总结 Python中应该使用%还是format来格式化字符串?

    %还是format Python中格式化字符串目前有两种阵营:%和format,我们应该选择哪种呢? 自从Python2.6引入了format这个格式化字符串的方法之后,我认为%还是format这根本 ...

  7. noi.ac 字符串游戏

    题面 Zhangzj和Owaski在玩一个游戏.最开始有一个空的01串,Zhangzj和Owaski轮流进行操作,Zhangzj先走.每次进行操作的人可以在串上任意位置加一个新的字符,由于串是01串, ...

  8. Java如何实现定时任务?

    我是3y,一年CRUD经验用十年的markdown程序员‍常年被誉为优质八股文选手 挺早就规划了要引入分布式定时任务框架了,在年前austin就已经接入了,但代码过年一直都没写,文章也就一直拖到今天了 ...

  9. Python datetime获取当前年月日时分秒

    from datetime import datetime now_time = datetime.now() str_time = now_time.strftime("%Y-%m-%d ...

  10. mysql 客户无感知迁移_亿级账户数据迁移,不用数据库工具还能怎么搞?

    原标题:亿级账户数据迁移,不用数据库工具还能怎么搞? 背景 在阿里巴巴内部"大中台,小前台"的组织和业务体制,使前线业务更加敏捷,赋能业务积极迎接未来挑战和机遇,在阿里大中台能力建 ...