*🚀 这是可能是一条并不硬的硬广，目的是在剧大神的众多粉丝中脱颖而出，并成功进行引流 🥶* 偷偷的瞄了一眼[老剧的文章加载代码](https://github.com/bh-lay/blog/blob/d352d87fce4ec976629d607b6b64fb8f7ec01778/frontEnd/single-page-version-js/src/js/stick.js#L192)，正好最近在研究 [《用IntersectionObserver 取代比较重的 scroll 监听进行懒加载》](https://www.zhuwenlong.com/blog/article/62cef4e64f361cff1aa9c174) 的内容，特呈上来给剧老板查阅 🧑‍💻。

催更！催更！催更！🫠

从小剧起始页过来的，大佬知识面挺吓人，啥都搞过。

阅

@Hanson 小声点，暴露年纪。

@猫貉子 Safari 还是比较大胆的，直接不支持了，不像 Chrome 还能苟一段时间。

曾几何时，用过txt文件来存储页面数据~

离了个大普，去年刚学的 WebSQL 这就作废了，前端真是谜一样的神奇😣

我来过～

日常膜拜

@回家的流星 群里有小伙伴讨论过类似问题，我把回答整理下吧 这个方法看起来是可行的，不过有两个问题 - 拖拽的过程中，要尽力避免去读取 dom 的状态，通过 target 判断一般还需要还再向上遍历父级节点，实现起来会比较卡 - 另一个弊端是会触发无关元素的 hover，拖拽效果不稳定

不懂，为什么需要提前将目标收集起来呢，mousemove 的过程中不是会在 event.target 中上体现出目标元素吗 ？

@二狗 文章里主要在写拖拽的原理，具体命中逻辑并没有展开聊。 我这边判断拖拽行为的顺序有三个 - 第一顺序是拿鼠标位置与所有区块做对比，命中哪个区块就是覆盖 - 第二顺序是，判断是否在区块水平左侧20像素内，命中的话就是插入行为 - 第三顺序是，判断是否在删除、调整尺寸的区域，命中的话就是这类交互 - 如果都没有命中的话，那就是cancel

看完受益颇多 不过还有个疑问 拖拽过程中 节点交互是如何设计与实现的呢

@404修复者 这是五年前整理的文章了，和目前的代码多少有点出入。 现在已经不打算做相关初始化支持了，自己也已经三年多没换服务器了，勉强还能跑起来，悲催。