<!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. MOS管防止电源反接的原理

    [导读]  一般可以使用在电源的正极串入一个二极管解决,不过,由于二极管有压降,会给电路造成不必要的损耗,尤其是电池供电场合,本来电池电压就3.7V,你就用二极管降了0.6V,使得电池使用时间大减. ...

  2. 配置VMware中的Ubuntu能够被其他机器ssh远程

    配置虚拟机Ubuntu能够被其他机器 ssh远程 将虚拟机Ubuntu改成桥接模式 在Ubuntu中安装openssh sudo apt install openssh-server -y sudo ...

  3. springboot成神之——发送邮件

    本文介绍如何用spring发送邮件 目录结构 依赖 MailConfig TestController 测试 本文介绍如何用spring发送邮件 目录结构 依赖 <dependency> ...

  4. DataTable改变column类型

    1.必须先克隆DataTable 2.列换类型 3.逐行往新DataTable赋值,并转换某列类型 如: DataTable dt = diorg.Clone(); //必须先克隆,此时并不包含数据 ...

  5. 摄影之HDR

    摄影之HDR 高动态范围图像(High-Dynamic Range,简称HDR),相比普通的图像,可以提供更多的动态范围和图像细节,根据不同的曝光时间的LDR(Low-Dynamic Range)图像 ...

  6. ffmpeg相关时间概念

    v_rescale_q用于计算Packet的PTS.av_rescale_q的返回值是一个很大的整数,且每次计算的结果间隔很大. 不同于avcodec_encode_video改变AVCodecCon ...

  7. 【知识碎片】python 篇

    领域:运维 网站 游戏 搜索 嵌入式 C/S软件 Openstack二次开发 绿色版:Portable Python 面向对象.解释型动态语言 env python 切换版也好使,自己寻找系统中pyt ...

  8. axis1.4 发布webservice的问题

    用axis1.4 发布webservice的问题 The service class "org.gdt.sgcda.wf.impl.DefinitionManageServiceImpl&q ...

  9. 【290】Python 模块

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

  10. java中的报错机制

    异常:Exception,程序运行过程中因为一些原因,使得程序无法运行下去 注意:在程序能够运行起来的情况,不是程序编译通不过 举例:读文件,点击一个按钮,文件不存在:访问数据库服务器,数据库服务器停 ...