在前端开发中，我们经常需要等待 DOM 加载完毕后再执行一些操作。domready-loaded 是一款可以用来判断 DOM 是否加载完毕的 npm 包，它可以帮助我们更加方便地实现这一功能。
安装
使用 npm 安装：
--- ------- --------------- ------
使用示例
------ -------- ---- ------------------ ----------- -- - -- --- ---------- ---
在这个示例中，我们使用 ES6 的模块化语法来导入 domready-loaded，然后直接把需要执行的操作作为回调函数传递给 domready()，在 DOM 加载完毕后就会执行这个回调函数。
深入了解
domready-loaded 实际上是对 document.readyState 和 document.addEventListener('DOMContentLoaded') 的封装。它会判断 document.readyState 是否为 'complete'，如果不是，则会绑定一个 'DOMContentLoaded' 事件的监听器，等待 DOM 加载完毕后执行回调函数。
同时，domready-loaded 也可以兼容一些老版本的浏览器，比如 IE6。对于这些浏览器，它会通过判断 document.body 是否存在来判断 DOM 是否加载完毕。
总结
domready-loaded 可以帮助我们更加方便地实现 DOM 加载完毕后的操作。使用它可以让我们的代码更加简洁易读，同时也兼容老版本的浏览器。在实际的开发中，我们可以在需要等待 DOM 加载的操作中使用 domready()，提高代码的健壮性和稳定性。
示例代码
--------- -----
------
------
---------------------- ------------
-------
------
------- --------------------------
-------
------------- -------- ---- ------------------ ----------- -- - ----- ------- - ------------------------------ ----------------- - ------ -------- ----------------------------------- ---
在这个示例中，我们创建了一个 div 元素，并在回调函数中将它添加到了 body 标签中。由于我们使用了 domready()，所以这个操作一定是在 DOM 加载完毕后才会执行。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600672683660cf7123b365d3