<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>javascript点击变绿色再点击变红色</title>

</head>

<body>

    <div></div>

    <div></div>

    <div></div>

    <script type="text/javascript">

        var div = document.getElementsByTagName('div')[0];

        div.style.backgroundColor="red";

        div.style.width="50px";

        div.style.height="50px";

        var count = 0;//计数器

        div.onclick=function(){

            count ++;

            if(count % 2 == 1){

                this.style.backgroundColor='green';

            }else{

                this.style.backgroundColor='red'

            }

        }

    </script>

</body>

</html>

效果图：

javascript点击变绿色再点击变红色的更多相关文章

  1. jquery实现点击显示，再点击隐藏

    //点击a标签,轮流显示和隐藏<div id="timo" style="background-color:red;height:50px;width:50px;& ...

  2. vue实现动态绑定class--（boolean）绑定class,点击有，再点击取消

    <template> <div :class="{'flag':selected}" @click=clickBtn>xxx</div>< ...

  3. Js 实现 多个tr 点击变色，再点击还原

    我用的是渲染页面,将自定义的值作为一个表示符判断当前状态 <!DOCTYPE html> <html> <head> <meta charset=" ...

  4. jq点击显示，再点击隐藏

    每次都会遇到的问题: <script> $("button").click(function(){ if($(".div").css("d ...

  5. jquery checkbox点击选中，再点击取消选中

    if(n==1){ if($("#abs1").is(':checked')){ $("#abs1").prop("checked",fal ...

  6. checkbox点击选中，再点击取消，并显示在文本框中

    function checkItem(e,itemId) { var item = document.getElementById(itemId); var $items = $(item); if ...

  7. 点击div全选中再点击取消全选div里面的文字

    想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...

  8. 原生JS实现点击一个按钮显示一个div，再点击按钮div隐藏，或点击除div外其它空白处div隐藏

    <!DOCTYPE html> <html style="font-size: 24px"> <head> <title>js点击按 ...

  9. js限制图片大小、点击放大图片、点击在新开页面显示

    缩放图片到合适大小        function ResizeImages() {            var myimg, oldwidth, oldheight;            var ...

随机推荐

  1. 缓存 memcached 与 redis

    Memcached Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度 ...

  2. 完整部署OpenStack-memcache配置

    一.[root@openstack-server ~]# nova listERROR (CommandError): You must provide a username or user id v ...

  3. Oracle 10g RAC 如何配置 VIP IPMP

    metalink note 283107.1介绍了如何设置VIP的IPMP,此处记录一下设置过程. o Existing 10g RAC installation ^^^^^^^^^^^^^^^^^^ ...

  4. Android 4 学习（10）：Adapters简介

    参考<Professional Android 4 Development> Adapters简介 Adapter用于将数据和实现AdapterView接口的ViewGroup绑定在一起. ...

  5. 利用 Flask+Redis 维护 IP 代理池

    代理池的维护 目前有很多网站提供免费代理,而且种类齐全,比如各个地区.各个匿名级别的都有,不过质量实在不敢恭维,毕竟都是免费公开的,可能一个代理无数个人在用也说不定.所以我们需要做的是大量抓取这些免费 ...

  6. Java调用Webservice(asmx)的几个例子

    Java调用Webservice(asmx)的几个例子 2009-06-28 17:07 写了几个调用例子: 1. import org.apache.axis.client.*;import org ...

  7. 【290】Python 模块

    参考:Python 模块 目录: 1. import 语句(模块的引入) 2. from...import 语句 3. from...import * 语句 4. dir() 函数 5. Python ...

  8. 使用avalon实现SKU组合查询功能

    SKU(stock keeping unit库存量单位)组合查询是网上商场一个非常常用的功能.具体来说,一件商品会有许多型号,许多颜色,许多产地,许多码寸,而满足用户选中的这些条件的具体商品可能有库存 ...

  9. UIAtlas

    [UIAtlas] UIAtlas is a container that has coordinate information for a bunch of sprites. AtlasType有2 ...

  10. 安装 Windows Service

    1.打开 VS 命令行窗口 2. installutil /u  service文件路径  (卸载原有服务) 3, installutil /i  service 文件路径 (安装服务)