1、获取角色和怪物的坐标位置：使用JavaScript的getBoundingClientRect()方法获取角色和怪物的坐标位置。
2、计算角色和怪物的距离：使用两点间距离公式计算角色和怪物的距离。
3、判断角色是否在怪物跟踪范围内：当角色和怪物的距离小于一个特定的跟踪范围时，表示角色在怪物跟踪范围内。
4、设置角色跟踪移动速度：设置怪物每次移动的速度，使它能够朝向角色并靠近。
5、在每一帧动画中执行跟踪动作：使用JavaScript的requestAnimationFrame()方法，在每一帧动画中执行跟踪动作。
下面是一个示例代码，它展示了如何实现自动跟踪功能：
// 获取角色和怪物的坐标位置
var characterRect = character.getBoundingClientRect()
var monsterRect = monster.getBoundingClientRect()
// 计算角色和怪物的距离
var distance = Math.sqrt(Math.pow(characterRect.x - monsterRect.x, 2) + Math.pow(characterRect.y - monsterRect.y, 2))
// 判断角色是否在怪物跟踪范围内
if (distance <TRACKING_RANGE) {
// 设置角色跟踪移动速度
var speedX = (characterRect.x - monsterRect.x) / distance
var speedY = (characterRect.y - monsterRect.y) / distance
// 在每一帧动画中执行跟踪动作
function trackCharacter() {
// 获取当前角色和怪物的坐标位置
characterRect = character.getBoundingClientRect()
monsterRect = monster.getBoundingClientRect()
// 计算角色和怪物的距离
distance = Math.sqrt(Math.pow(characterRect.x - monsterRect.x, 2) + Math.pow(characterRect.y - monsterRect.y, 2))
// 判断角色是否在怪物跟踪范围内
if (distance <TRACKING_RANGE) {
// 更新怪物的坐标位置
monster.style.left = monsterRect.x + speedX + "px"
monster.style.top = monsterRect.y + speedY + "px"
// 继续跟踪角色
requestAnimationFrame(trackCharacter)
}
}
trackCharacter()
}
分析该过程，可拆分成两个步骤：
该布局基于 element-ui，一个父容器 box，里面一个 mask div，一个 el-checkbox-group 块。其中父容器设置 position: relative子 mask 容器设置 position: absolute并且其宽、高、偏移值根据鼠标当前位置动态计算
该部分逻辑实际上可拆分为 4 个步骤：
1. 给 box 绑定 mousedown 事件
2. mousemove 事件，比较简单，只是更新 end_x，end_y 坐标
3. mouseup 事件，移除 mousemove、mouseup 事件，并调用判断方法
4. 处理框选逻辑
难点是如何判断元素是否被框选住
问题可转化为 框选矩形是否与 checkbox 矩形 相交或者包含在内,即 两矩形是否相交或者存在包含关系
假定矩形 A1 左上角坐标为 (x1,y1)矩形宽度为 width1,高度为 height1
假定矩形 A2 左上角坐标为 (x2,y2)矩形宽度为 width2,高度为 height2
画图分析，只看水平方向：
由图可以得出，x 方向上：
令 maxX = Math.max(x1 + width1, x2 + width2)
令 minX = Math.max(x1, x2)
若相交或包含则必满足： maxX - minX <= width1 + width2
同理可以容易得到 y 轴相交的判断
使用 Element.getBoundingClientRect()获取 dom 元素位置信息
该部分逻辑如下，比较简单
难点已经攻破，遍历 checkbox 集合，每个 checkbox 都执行上面的矩形相交判断，并进行相应的勾选处理，此处不再多累述
源码
END
<script>var d1="201702", d2="201812" //这两个日期的获取自己搞定
var y1=parseInt(d1.substr(0,4))
var m1=parseInt(d1.substr(4,2))-1
var y2=parseInt(d2.substr(0,4))
var m2=parseInt(d2.substr(4,2))-1
do{
var d=new Date(y1,m1++,1)
var y=d.getFullYear()
var m=d.getMonth()+1
var s=y+(m<10?"0":"")+m //这个s就是要打印的日期字串
console.log(s) //打印方法自己改
}while(d<new Date(y2,m2,1))
</script>
