百度地图API的两种加载方式

富足奶茶

于 2022-01-19 15:32:41 发布

阅读量2.7k

点赞数

分类专栏： Web开发文章标签：百度地图

本博客所有原创文章（包括但不限于文字、代码、图表、多媒体内容等）均受《中华人民共和国著作权法》保护，未经授权禁止任何形式的商业性使用。

本文链接：https://blog.youkuaiyun.com/tdcqfyl/article/details/122582224

版权

Web开发专栏收录该内容

12 篇文章

订阅专栏

本文介绍了两种百度地图API的加载方式：同步加载和异步加载（推荐）。同步加载可能在网络环境不佳时阻塞其他资源加载；异步加载通过设置callback参数实现加载完毕后的回调，更加高效灵活。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 同步加载

直接在页面中使用script标签，引入api地址即可，如下：

<script src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥" type="text/javascript"></script>

2. 异步加载（推荐）

引入api地址的时候添加callback回调参数，当脚本加载完成后callback函数会被立刻调用，如下：

function loadBaiDuScript() {

    var script = document.createElement("script");

    script.src = "http://api.map.baidu.com/api?v=2.0&ak=您的密钥&callback=initializeMap";

    document.body.appendChild(script);

}

function initializeMap() {

    // 此处编写百度地图的初始化代码

}

调用方式：

window.onload = loadBaiDuScript;

或者jquery方式

$(function(){

    loadBaiDuScript();

});

其中，initializeMap为回调函数名称，名字可以自定义。

Tips：同步加载，在网络环境不好的情况下，很可能会阻塞其它静态资源的加载。