<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <img src="img/0.png" />

        <img src="img/0.png" />

        <img src="img/0.png" />

        <img src="img/0.png" />

        <img src="img/0.png" />

        <div id="div1"></div>

    </body>

</html>

<script>

    var imgs= document.getElementsByTagName("img");

    var l=imgs.length;

    for(let i=0;i<l;i++){

        let img=imgs[i];

        img.i=i;

        img.onmouseout=function(){

            var n=img.i;

            for(var j=0;j<=n;j++){

                imgs[j].src="img/1.png"

            }

        }

        img.onmouseover=function(){

            for(var i=0;i<5;i++){

                imgs[i].src="img/0.png"

            }

            var n=img.i;

            for(var j=0;j<=n;j++){

                imgs[j].src="img/1.png"

            }

        document.onmousedown=function(){

                div1.innerHTML=j+"星";

        }

        }

    }

</script>

超简单的js评价小星星的更多相关文章

  1. 超简单的js数字验证

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or ...

  2. 超简单的js实现提示效果弹出以及延迟隐藏的功能

     自动登录勾选提示效果 要求:鼠标移入显示提示信息框:鼠标离开,信息框消失,消失的效果延迟 <!DOCTYPE html> <html lang="en"> ...

  3. ECharts.js 超简单入门（本质canvas）

    ECharts.js 超简单入门(本质canvas) 一.总结 一句话总结:echarts这些图标的本质都是canvas. 二.ECharts.js学习(一) 简单入门 EChart.js 简单入门 ...

  4. 超简单的OpenGL & WebGL & Three.js介绍_1

    专业解释 什么是OpenGL OpenGL(Open Graphics Library即开放图形库或者“开放式图形库”)是用于渲染2D.3D矢量图形的跨语言.跨平台的应用程序编程接口(API). 这个 ...

  5. ASP.NET中一种超简单的Ajax解决方案

    为什么是Ajax2? 因为之前有一个blqw.Ajax,并且已经在项目中投入使用了,但是没有这个方便,这个是后来才弄的,为了纪念第一版的blqw.Ajax,所以这个就2了... 话说看了评论才发现,原 ...

  6. 打造支持apk下载和html5缓存的 IIS（配合一个超简单的android APP使用）具体解释

    为什么要做这个看起来不靠谱的东西呢? 由于刚学android开发,还不能非常好的熟练控制android界面的编辑和操作,所以我的一个急着要的运用就改为html5版本号了,反正这个运用也是须要从serv ...

  7. 超简单jQuary链式操作代码实现手风琴效果

    超简单jQuery代码实现手风琴效果 HTML代码 <div id="cont"> <div> <p>人生若只如初见</p> < ...

  8. 超简单工具puer——“低碳”的前后端分离开发

    本文由作者郑海波授权网易云社区发布. 前几天,跟一同事(MIHTool作者)讨教了一下开发调试工具.其实个人觉得相较于定制一个类似MIHTool的Hybrid App容器,基于长连的B/S架构的工具其 ...

  9. 三行代码实现.NET MVC统计显示页面的执行时间 超简单的实现方法 分析页面执行效率

    三行代码实现.NET MVC统计显示页面的执行时间 超简单的实现方法 分析页面执行效率    博客页脚处添加了页面执行时间统计显示,如下图所示,也可以直接查看网页页脚处. 实现方法非常简单,只需三行代 ...

随机推荐

  1. js运算

    今天把五个题目都做出来了,虽然可能用的方法比较麻烦.不过总体来说不错: <!DOCTYPE html><html> <head> <meta charset= ...

  2. Springboot系列文章

    一.springboot简介1.前世今生 在boot没有出现之前,基于spring的开发,常常需要配置大量的xml文件.工程狮们苦不堪言,渐渐厌倦了配置文件的复制黏贴.spring家族因为这件事,也经 ...

  3. VMware Workstation 12 Pro 之安装林耐斯-Solus-系统

    VMware Workstation 12 Pro 之安装林耐斯-Solus-系统... ----------------- ----------------- ------------------- ...

  4. Java web开发，在一个jsp里放太多java代码的后果，摘自 java web轻量级开发面试教程

    现要做一个简单的登录页面,如果用户通过验证,会显示Welcome用户名的欢迎词,反之则返回登录页面让用户再次输入 这部分的完整代码是JSPDemo项目里的login.jsp,下面来分析一下关键代码. ...

  5. CY7C68013A控制传输

    大家好,你们的大熊又回来了.本篇文章我们来重点了解一下USB设备的四大传输方式之一--控制传输.不同于其他三种传输方式,控制传输有其独特的作用和功能,是一个USB设备必须支持的传输方式.控制传输对带宽 ...

  6. 微信原图泄露的只能是 Exif ，你的隐私不在这！！！

    版权声明: 本账号发布文章均来自公众号,承香墨影(cxmyDev),版权归承香墨影所有. 每周会统一更新到这里,如果喜欢,可关注公众号获取最新文章. 未经允许,不得转载. 序 最近很多公众号都推送了关 ...

  7. python专题-异常处理（基础）

    之前在学习python的时候有整理过python异常处理的文章,不够简单也不够完整,所以决定再整理一篇,算做补充. http://www.cnblogs.com/cmt110/p/7464748.ht ...

  8. python基础教程（十）

    魔法方法.属性 ------------------------ 准备工作 为了确保类是新型类,应该把 _metaclass_=type 入到你的模块的最开始. class NewType(Objec ...

  9. 再起航，我的学习笔记之JavaScript设计模式17(模板方法模式)

    模板方法模式 由模板方法模式开始我们正式告别结构型设计模式,开始行为型设计模式的学习分享 行为型设计模式用于不同对象之间职责划分或算法抽象,行为型设计模式不仅仅涉及类和对象,还涉及类或对象之间的交流模 ...

  10. 【搬运工】之YSlow安装教程

    YSlow安装教程(我只是搬运工,推荐好用的地址) 地址: https://devework.com/yslow.html YSlow (解析为 why slow)是雅虎基于网站优化规则推出的工具,帮 ...