在前端开发中，我们经常需要引入第三方库或者自己编写的 JavaScript 脚本。为了确保脚本的正确执行，我们需要验证它们是否已经成功加载。
如何验证？
方式一：判断全局变量
通常情况下，外部脚本成功加载后会定义一个全局变量。因此，我们可以通过判断该变量是否存在来验证脚本是否已经加载。
例如，在使用 jQuery 库时，我们可以检查 $ 是否已经被定义：
-- ------- - --- ------------ - -- - -------- ------ ------- - ---- - -- - ------ ------ -------- -
方式二：监听事件
有些外部脚本在加载完成后会触发一个特定的事件。我们可以利用这个事件来判断脚本是否已经加载完成。
以百度地图 API 为例，它会在加载完成后触发 onload 事件：
------- ---------------------- ------------------------------------------------------------------------------------
------- -----------------------
-------- ------ -
-- ---- --- ------
-
---------方式三：Promise 对象
如果你使用的浏览器支持 Promise 对象，你可以将外部脚本的加载封装成一个 Promise 对象，并在其 resolve 后执行相应的操作。
例如，我们可以编写一个函数 loadScript，使用 Promise 对象来检测脚本是否已经成功加载：
-------- --------------- -
------ --- ------------------------- ------- -
--- ------ - ---------------------------------
---------- - ----
------------- - ---------- -
----------
--
-------------- - ---------- -
---------
--
----------------------------------
---
-
-- ----
--------------------------------------------------------------------------
---------------- -
-- ------ -------
--
----------------- -
-- ----
---总结
验证外部脚本是否已经加载是前端开发中常见的问题。本文介绍了三种验证方式：判断全局变量、监听事件和 Promise 对象。每种方式都有其适用的场景，在实际开发中需要根据具体情况选择合适的方式进行验证。
希望本文能够对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/15697