运行效果：

源代码：

 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. SETTLE约束算法的批量化处理

    技术背景 在上一篇文章中,我们介绍了在分子动力学模拟中SETTLE约束算法的实现与应用,其中更多的是针对于单个的水分子.但由于相关代码是通过jax这一框架来实现的,因此对于多分子的体系,可以采用jax ...

  2. insert一个表的数据到另外一个表

    insert into a(real_name,is_main,mobile,password,property_id,create_time) select linkman as real_name ...

  3. tensorflow源码解析之framework-tensor

    目录 什么是tensor tensor继承体系 与Eigen3库的关系 什么是tensor_reference tensor_shape tensor_slice 其它结构 关系图 涉及的文件 迭代记 ...

  4. 将su模型导入arcgis，并获取高度信息，多面体转shp文件（ArcMap）

    问题:将Sketchup中导出的su模型,导入arcgis并得到面shp文件,进而获取各建筑的高度.面积等信息. 思路: (1)导入arcgis得到多面体 (2)转为面shp文件 (3)计算高度/面积 ...

  5. (leetcode)链表反转-c语言实现

    反转一个单链表. 示例: 输入: 1->2->3->4->5->NULL 输出: 5->4->3->2->1->NULL 使用迭代方法,代码 ...

  6. [SPDK/NVMe存储技术分析]010 - 理解SGL

    在NVMe over PCIe中,I/O命令支持SGL(Scatter Gather List 分散聚合表)和PRP(Physical Region Page 物理(内存)区域页), 而管理命令只支持 ...

  7. Python 的排序方法 sort 和 sorted 的区别

    使用 sort() 或内建函数 sorted() 对列表进行排序.它们之间的区别有两点: sort() 方法是对原列表进行操作,而 sorted() 方法会返回一个新列表,不是在原来的基础上进行操作. ...

  8. OpenCores注册步骤和成功提交

    一  OpenCores 网站简介,这个是全世界最大的FPGA开源IP核网站.由于最近在学习USB2.0host control IP,所以想去网上下载相关的IP例程学习.通过搜索发现,有两个网站十分 ...

  9. java反射笔记（学习尚硅谷java基础教程）

    反射一.概述:Reflection Reflection(反射)是被视为动态语言的关键,反射机制允许程序在执行期借助于Reflection API取得任何类的内部信息,并能直接操作任意对象的内部属性 ...

  10. Python的安装与开发环境的选用

    2021快要结束了,这一年我依旧深耕于python的广阔土壤,将重点放在机器人和传感器的角度.也收获了一大批正在学习和期望学习python的朋友. 正在学习的暂且不言,这篇主要是写给期望学习的朋友,同 ...