#优质博文 #前端 #css
dom 获取不到？试试 CSS 动画监听元素渲染吧

摘要: 本文介绍了在数据驱动视图框架中，如何通过 CSS 动画监听 DOM 元素的渲染，以解决无法及时获取 DOM 元素的问题。作者首先指出了传统方法（如 Vue 的 nextTick 或使用定时器）的不稳定性，并提出了使用 MutationObserver 的官方方式，但认为其过于复杂。因此，提出了一种新方法：通过为元素添加 CSS 动画，在动画触发时监听元素渲染。文章详细介绍了这一技巧的实现原理及应用场景，包括多行文本展开收起、文本超长自动滚动、元素锚定定位等。最后，作者提醒在框架中使用时需注意动画名称可能因编译而改变，建议使用 startsWith 进行判断。总体来看，这是一个简单有效的技巧，能够在保证性能的同时，解决 DOM 获取的难题。

via 微信公众号 前端侦探

Weixin Official Accounts Platform

dom 获取不到？试试 CSS 动画监听元素渲染吧

在数据驱动视图的框架下，你最头疼的事情是什么？没错，就是获取dom。大部分业务逻辑都可以在数据层面进行处理，