javascript采草药第二季实现随机草药显示

1、鼠标点在草药上看看是否有效果

这里用consol.log(this) 测试看看this

代表什么

2、在浏览器运行这个页面，点草药，看看控制器输出什么结果

从输出结果看，是指这个草药的div

3、下面可以布置代码如下：

var grass = $("#grass");

           grass.click(function(){

               $(this).css("display","none");

           })

鼠标点击，让草药消失

4、因为草药消失要换位置，这时候要用到jquery的position()方法

而position方法是没办法在草药层隐藏起来获取位置的，

这里采用先删除草药，然后过一会再添加一个草药层

5、对应的css文件也要把布局调整一下

6、新生成的草药换一下位置

这里只是把位置换成20px

7、浏览器运行点击草药，草药移动20px

300px 变成320px

8、让草药点击消失后，在过一段时间在出现

这里用setTimeout()过一段时间执行改变位置函数

9、为了让点草药循环执行，这里用循环函数执行

10、因为上一个草药已经删除，下一个草药的位置需要保持起来，以备下一个草药使用

11、每次都移动20px显然不行，得让他随机显示位置

这里调用随机函数rand_fn

12、这是随机函数

传递最大数，最小数 ，返回其中一个数

这个随机函数配合数组使用比较方便

13、这样每次采集草药后，下一个草药过一段是就会随机显示出来