JS计数

JS计数

下面我们使用Visual Studio这个软件来写一个JS.的代码，我们可以用JS的代码写一个简单的方法，就是实现用JS语句写一个实现计数的功能。
那么这个代码要怎么写呢，首先我们需要先在界面上写一下的Html的代码，我们来看一下界面的代码是什么，看以下截图：

在截图中我们可以看到界面的代码就是非常的简单啦。就是先用一个div包裹着一个span标签。里面就是给了一个id为span，接着就给他2个button的按钮，然后就可以写一下利用JS语句来做一个计数的功能。
然后我们利用style属性给他美观优化一下他的样式，看一下他的属性样式的代码。
看以下截图：

我们刚在html页面上给了一个class类名称为body，然后在style上给他设置了一下的样式，然后还要button的样式。优化一下他的美观效果。
Html界面就这么简单了，然后我们来写一下script里面的代码。
代码的内容，见截图：

首先我们先写一个script的方法，然后在这个方法里面写上代码。
我们通过第32行写了一个事件，那么他是个什么意思呢，首先document.getElementsByTagName的意思就是返回集合，那么他的意思就是获取到的是第一个button的集合，然后点击事件。
接着看33行就是e.stopPropagation的意思就是该方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。简单点来说呢就是阻止事件向外部执行,即点击开始按钮时不会加1,只有点击window才会开始加1。
接着我们看34行的代码就是一个窗口的点击事件，然后是一个let的关键字，
它跟var关键字的区别就是。
声明后未赋值，表现相同
使用未声明的变量，表现不同
重复声明同一个变量时，表现不同
变量作用范围，表现不同
然后他的意思就是获取到span的id后返回他的集合，然后innerText的意思就是从起始位置到终止位置的内容, 但它去除Html标签，接着就是获取到他返回的集合的i在进行+1。这样就可以实现出来，当你点击开始计数的时候，在window点击多少下，他就会进行计数，然后在这个方法后面还给他加了一个停止计数的功能。他的获取方法跟上面的一样。就是获取到button的[1]标签就是获取到button的第二个标签，然后给他一个点击的事件。事件的里面就是点击为null。就是停止这个结果。
看以下截图代码：

接着我们就可以从页面上看到上面截图的效果，他的流程就是非常简单的就是，先设置开始计算按钮事件然后接着阻止事件向外部执行,即点击开始按钮时不会加1,只有点击window才会开始加1然后接着就是窗口点击事件就可以实现出这样的效果，最后就是设置停止计数按钮事件。