引入百度地图js时产生的问题
2017-01-11 本文已影响0人
Ernest_Chou
页面引入百度地图API:
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT"></script>
产生如下问题:
api:1 A Parser-blocking, cross-origin script, http://api.map.baidu.com/getscript?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&services=&t=20150527115231, is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.
即为报错:A Parser-blocking, cross-origin script, is invoked via document.write.
在页面渲染完成后就不能使用 document.write 方法。
根据博客的说明尝试如下方法:
<script>
//异步加载百度地图,解决谷歌等浏览器在页面渲染完成后就不能使用 document.write 方法的问题:
var cnzz_s_tag = document.createElement('script');
cnzz_s_tag.type = 'text/javascript';
cnzz_s_tag.async = true;
cnzz_s_tag.charset = 'utf-8';
cnzz_s_tag.src = 'http://api.map.baidu.com/api?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&async=1';
var root_s = document.getElementsByTagName('script')[0];
root_s.parentNode.insertBefore(cnzz_s_tag, root_s);
</script>
出现问题:
api:1 Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.
后来发现页面引入的百度的js内容为:
(function(){
window.BMap_loadScriptTime = (new Date).getTime();
document.write('<script type="text/javascript" src="http://api.map.baidu.com/getscript?v=1.3&ak=XhxWo4lQh2KfH3phyElA17ljQC1wwqjT&services=&t=20150527115231"></script>');
document.write('<link rel="stylesheet" type="text/css" href="http://api.map.baidu.com/res/13/bmap.css" />');
})();
里面包含了 document.write方法,异步加载的js是不允许使用document.write方法的
直接引用这两个地址的jshttp://api.map.baidu.com/getscript?type=quick&file=api&ak=o9B4Ol99j9NcBXSu5nFTR7uI&t=20140109092002
和 http://api.map.baidu.com/getscript?type=quick&file=feature&ak=o9B4Ol99j9NcBXSu5nFTR7uI&t=20140109092002
就可以了