JS星星发光

本文介绍了如何使用JavaScript和Visual Studio创建一个简单的星星发光效果。通过在HTML中添加背景为黑色的body元素,并在JavaScript中编写代码,实现当鼠标点击时,动态生成带有随机大小和位置的发光星星图片。讲解了let关键字的用法,以及如何利用onclick和clientX/clientY属性确定图片的插入位置。
摘要由CSDN通过智能技术生成

JS星星发光

下面我们使用Visual Studio这个软件来写一个JS.的代码,我们可以用JS的代码写一个简单的方法,就是实现一个用gif图然后结合JS实现发光的效果。
那么这个代码要怎么写呢,首先我们需要先在界面上写一下的Html的代码,我们来看一下界面的代码是什么,看以下截图:

在这里插入图片描述

在截图中我们可以看到界面的代码就是非常的简单啦。就是直接用一个body里面直接给他写一个属性,这个属性是背景颜色为黑色的。
Html界面就这么简单了,然后我们来写一下script里面的代码。
代码的内容,见截图:

在这里插入图片描述

首先我们先写一个script的方法,然后在这个方法里面写上代码。
我们通过第24行写一个鼠标点击的方法。
这个onclick的意思就是该onclick属性返回当前元素的click事件处理程序代码。
注意:当使用该click事件触发某个动作时,还可以考虑将相同的动作添加到该keydown事件中,以允许不使用鼠标或触摸屏的人使用该动作
然后第25行就是let关键字,它跟var关键字的区别就是。
声明后未赋值,表现相同
使用未声明的变量,表现不同
重复声明同一个变量时,表现不同
变量作用范围,表现不同
然后他的意思就是创建一个imgÿ

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值