使用 JavaScript 的 HTML 页面混合、根据在下拉列表框中选择的内容,决定页面效果,用户在下拉列表框中选择页面将要使用的背景颜色
查看本章节
查看作业目录
需求说明:
根据在下拉列表框中选择的内容,决定页面效果
用户在下拉列表框中选择页面将 要使用的背景颜色
当用户选择橙色时,页面背景将显示为橙色
实现思路:
- 用表单 <select> 元素列出可以选择的背景颜色
- 在 JavaScript 脚本中设置 <select> 元素对象的 onchange 事件属性,让 onchange 事件属性值等于处理该事件的匿名函数
- 在匿名函数内部获取 <select> 元素的选项值,并设置为页面背景色 使用浏览器预览效果
实现代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>请选择背景颜色:</h1>
<select id="setColor" >
<option value="white">白</option>
<option value="purple">紫</option>
<option value="orange">橙</option>
<option value="gray">灰</option>
<option value="yellow">黄</option>
</select>
<script type="text/javascript">
document.getElementById("setColor").onchange = function(){
document.bgColor=this.value;
}
</script>
</body>
</html>
使用 JavaScript 的 HTML 页面混合、根据在下拉列表框中选择的内容,决定页面效果,用户在下拉列表框中选择页面将要使用的背景颜色的更多相关文章
- 使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接
查看本章节 查看作业目录 需求说明: 使用 JavaScript 的 HTML 页面混合.JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出"点击我进 ...
- 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...
- marquee标签实现页面内容的滚动效果
页面的自动滚动效果,可由javascript来实现, 但是有一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 使用marquee ...
- 坑人的MyEclipse之-修改JSP页面的JavaScript背景颜色
MyEclipse开发JSP页面时,如果要写JavaScript代码, 背景颜色默认是白色!效果如下: 这种反人类的设计我已经无力吐槽了!要改为黑色的话可以通过下面的方法设置:
- 033. asp.netWeb用户控件之二将页面转换成web控件和使用Web控件显示热点新闻
访问Web用户控件的属性 ASP.NET提供的各种服务器控件都有其自身的属性和方法,程序开发人员可以灵活地使用服务器控件中的属性和方法开发程序.在用户控件中,程序开发人员也可以自行定义各种属性和方法, ...
- 高并发分布式系统中生成全局唯一(订单号)Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数
高并发分布式系统中生成全局唯一(订单号)Id 1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...
- Ruby Rails学习中:有点内容的静态页面
续上篇: 一. 有点内容的静态页面 rails new 命令创建了一个布局文件, 不过现在最好不用.我们重命名这个文件: $ mv app/views/layouts/application.html ...
- JS window对象 History 对象 history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。语法: window.history.[属性|方法]
History 对象 history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能. 注意:从窗口被打开的那一刻开始记录,每个浏览器窗口.每个标签页乃至每个框架,都 ...
- 如何在CSS中映射的鼠标位置,并实现通过鼠标移动控制页面元素效果
映射鼠标位置或实现拖拽效果,我们可以在 JavaScript 中做到这一点.但实际上,在CSS中有更加简洁的方法,我们可以在不使用JavaScript 的情况下,仍然可以实现相同的功能! 只使用CSS ...
随机推荐
- Shell学习(十)——du、df命令
一.du 命令 1.命令格式: du [选项][文件] 2.命令功能: 显示每个文件和目录的磁盘使用空间. 3.命令参数: -a或-all 显示目录中个别文件的大小. -b或-bytes 显示目录或文 ...
- Docker学习(四)——Docker容器连接
Docker容器连接 容器中可以运行一些网络应用,要让外部也可以访问这些应用,可以通过-P或-p参数来指定端口映射. 下面我们来实现通过端口连接到一个docker容器. 1.网络端口映射 ...
- 08-认证(Authorization)
这又是一个非常实用的功能,对我们做接口测试来说,经常要处理登录认证的情况 .如果不用这个Authorization其实也能解决认证的问题,无非就是把要认证的数据按照要求在指定位置传入参数即可.比如我们 ...
- 初始化Linux数据盘、磁盘分区、挂载磁盘(fdisk)
1.操作场景 2.前提条件 3.划分分区并挂载磁盘 4.设置开机自动挂载磁盘分区 1.操作场景 本文以云服务器的操作系统为"CentOS 7.4 64位"为例,采用fdisk分区工 ...
- 接口测试 python+PyCharm 环境搭建
1.配置Python环境变量 a:我的电脑->属性->高级系统设置->环境变量->系统变量中的PATH变量. 变量名:PATH 修改变量值为:;C:\Python27 ...
- Servlet(4):一个简单的注册页面
一. 注册要求 1. 一个注册页面 username (文本框) password:密码 (密码框) passwordYes :再次输入密码(密码框) hobby (多选框) sex (单选框) in ...
- 【Spring Framework】Spring 入门教程(一)控制反转和依赖注入
参考资料 Spring 教程 说在前面 什么样的架构,我们认为是一个优秀的架构? 判断准则:可维护性好,可扩展性好,性能. 什么叫可扩展性好? 答:在不断添加新的代码的同时,可以不修改原有代码,即符合 ...
- Redis缓存穿透、缓存击穿以及缓存雪崩
作为一个内存数据库,redis也总是免不了有各种各样的问题,这篇文章主要是针对其中三个问题进行讲解:缓存穿透.缓存击穿和缓存雪崩.并给出一些解决方案.这三个问题是基本问题也是面试常问问题. 这篇文章我 ...
- 【C/C++】【输入】关于scanf:输入空格,多次使用
一.C/C++中带空格字符串的输入 C++中的cin和C中的scanf都是遇到空格或回车结束. 如果要让scanf接收空格,可以用读入字符集合的方式.%[] char a[100]; scanf(&q ...
- 团队协作项目——SVN的使用
参考文献:https://www.cnblogs.com/rwh871212/p/6955489.html 老师接了一个新项目,需要团队共同完成开发任务,因此需要SVN.SVN是C/S架构: 1.服务 ...