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. [置顶] 文件和目录（二）--unix环境高级编程读书笔记

    在linux中,文件的相关信息都记录在stat这个结构体中,文件长度是记录在stat的st_size成员中.对于普通文件,其长度可以为0,目录的长度一般为1024的倍数,这与linux文件系统中blo ...

  2. sql的存储过程调用

    USE [ChangHong_612]GO/****** Object: StoredProcedure [dbo].[st_MES_GetCodeRule] Script Date: 09/10/2 ...

  3. 栈的应用1——超级计算器（中缀与后缀表达式）C语言

    这里要学的程序主要用来实现一个功能——输入表达式输出结果,也就是一个计算器.效果如下: 这个程序主要有两个步骤:1.把中缀表达式转换为后缀表达式:2.计算后缀表达式的结果. 首先先明白几个问题: 1. ...

  4. Android中图表AChartEngine学习使用与例子

    很多时候项目中我们需要对一些统计数据进行绘制表格,更多直观查看报表分析结果.基本有以下几种方法: 1:可以进行android  api进行draw这样的话,效率比较低 2:使用开源绘表引擎,这样效率比 ...

  5. IIS应用程序池性能分析

    #查看应用程序池和w3wp.exe进程的对应关系iisapp -a C:\windows\system32\inetsrv\appcmd.exe list wp 查看任务管理器: 在性能计数器中找到对 ...

  6. php 算法之切割数组，不用array_chunk()，算法之二，取数组的差值，不用array_diff()

    用php写算法切割数组,不用array_chunk();算法例如以下所看到的. <?php //$array 数组 //$size 每一个数组的个数 //每一个数组元素是否默认键值 functi ...

  7. python的一些总结1

    1.安装环境 window用户下载 python :https://www.python.org/downloads/release/python-2710/ 安装不解释.. 配置环境变量  找到 P ...

  8. 关于webapi 返回的类型的笔记

    经过测试发现使用IE浏览器返回的数据是json,而使用Firefox和Chrome返回的则为xml,经研究发现IE在发生http请求时请求头accpet节点相比Firefox和Chrome缺少&quo ...

  9. 2015南阳CCPC D - Pick The Sticks dp

    D - Pick The Sticks Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 无 Description The story happened lon ...

  10. pthread实现多线程查询(转)

    导读:大多数网站的性能瓶颈不在PHP服务器上,因为它可以简单地通过横向增加服务器或CPU核数来轻松应对(对于各种云主机,增加VPS或CPU核数就更方便了,直接以备份镜像增加VPS,连操作系统.环境都不 ...