index.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS之DivColorChange</title>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript" src="demo.js"></script>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div style="width:200px;height:200px;background:red;">
</div>
</body>
</html>

样式设置style.css:

.red {
color:red;
}
.green {
color:green;
}
.bg {
background-color:#ccc;
}
.size {
font-size:20px;
}

.js是jquery的脚本文件,作用是实现图片缓存和加载。(文件已经上传)

执行效果如图:

If reference to indicate the source:蔡都平

Javascript之改变盒子颜色的更多相关文章

  1. JavaScript:编程改变文本样式

    <!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" Content=&q ...

  2. [JS9] document's bgColor改变背景颜色

    <HTML> <HEAD> <TITLE>设置背景颜色</TITLE> </HEAD> <BODY> <CENTER> ...

  3. 怎么用js设置a标签点击链接改变当前颜色

    怎么用js设置a标签点击链接改变当前颜色 20 例如:多个a标签为白色,当点击其中一个a标签时改变那一个a标签的字体颜色为黄色,并且跳转到对应链接,当点击下一个a标签链接时,下一个为黄色,之前一个恢复 ...

  4. checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中

     checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...

  5. JavaScript动态改变表格单元格内容的方法

    本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格 ...

  6. Android--ColorMatrix改变图片颜色

    前言 本篇博客讲解如何通过改变图片像素点RGB的值的方式,在Android中改变图片的颜色.在最后将以一个简单的Demo来作为演示. 本篇博客的主要内容: ColorMatrix 使用ColorMat ...

  7. OpenGL的glClearColor和glClear改变背景颜色

    OpenGL的glClearColor和glClear改变背景颜色 结合以下两个函数void glClearColor(GLclampf red,    GLclampf green, GLclamp ...

  8. dev grdicontrol 根据条件改变行颜色,字体颜色等

    dev grdicontrol 根据条件改变行背景   dev grdicontrol 根据条件改变字体颜色  dev grdicontrol 根据条件改变某个单元格背景 不用写代码  打开gridc ...

  9. WPF动态改变主题颜色

    原文:WPF动态改变主题颜色 国内的WPF技术先行者周银辉曾介绍过如何动态改变应用程序的主题样式,今天我们来介绍一种轻量级的改变界面风格的方式--动态改变主题色. 程序允许用户根据自己的喜好来对界面进 ...

随机推荐

  1. Boost::Asio入门剖析

    Boost::Asio可以在socket等I/O对象上执行同步或异步操作,使用Boost::Asio前很有必要了解Boost::Asio.你的程序以及它们交互的过程. 作为一个引导的例子,我们思考一个 ...

  2. Velocity中#set指令

    引用可以让模板设计者生成动态内容,而指令允许设计者真正的负责页面的展现和内容. 指令是以#开头,后面紧跟一个关键字,比如if,else,foreach等.而这个关键字,是可以被放在{}中间的.这是规范 ...

  3. 哥也能写KMP了——实现strstr()

    经过上次去面试,面试官要求实现strstr(),当场就蒙了.这个题目是模式匹配问题,<算法导论>里列出了几种字符串匹配算法: 朴素算法 |  Rabin-Karp | 有限自动机算法 | ...

  4. servlet--页面自刷新

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletExcepti ...

  5. no datanode to stop

    昨晚整了半天,遇上的问题是通过start-all.sh无法启动datanode,然后关闭时就会报no datanode to stop ,引起这个的原因是因为我多次格式化,导致namespaceID不 ...

  6. 如何同时启动多个Tomcat服务

    在项目开发中,有时会需要同时启动多个Tomcat服务,如果直接启动多个的话,会报以下错误: Port busy xxxx java.net.SocketException: Unrecognized ...

  7. SmallDateTime时间范围检查

    SamllDataTime是SQL Server中的一种表达时间的类型, 精度不高但是省空间,具体的细节就查看一下MSDN的文档吧. http://msdn.microsoft.com/zh-cn/l ...

  8. C#用天气预报的WebServices

    后台代码: protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { WeatherWS ws = new W ...

  9. ios开发——实用技术篇&Pist转模型详细介绍

    Pist转模型详细介绍 关于Plist转模型在iOS开发中是非常常见的,每开一一个项目或者实现一个功能都要用到它,所以今天就给大家讲讲Plist怎么转成模型数据, 前提:必须有一个Plist文件或者通 ...

  10. xtrabackup原理0