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