需求:当百度地图在内网中也能使用。

分析:js判断是否联网,然后根据联网状态加载不同js。

失败案例:

1、直接document.write

<script language="javascript"> 

    document.write("<script src='xxx.js'><\/script>"); 

</script>

2、动态改变已有script的src属性

<script src='' id="s1"></script>

<script language="javascript"> 


    s1.src="xxx.js"

</script>

3、动态创建script元素

<script>

var oHead = document.getElementsByTagName('HEAD').item(0); 
    var oScript= document.createElement("script"); 
    oScript.type = "text/javascript"; 
    oScript.src="xxx.js"; 
    oHead.appendChild( oScript);

</script>

失败原因:这三种方法都是异步执行的,也就是说,在加载这些脚本的同时,主页面的脚本继续运行。导致下面的new BMap.Map()直接报错。正确的思路是用函数回调保证js加载完毕后继续执行后面代码。

正解:

需要js文件:Jquery.js,Ping.js

<script language="javascript">
$(function(){
var p = new Ping();
p.ping("http://api.map.baidu.com", function(err, data) {
if (err) { //离线
$.getScript("http://127.0.0.1:80/bdmap/js/apiv2.0.min.js",function(){ //加载内网js,成功后执行回调函数
$("<link>").attr({ rel: "stylesheet",type: "text/css",href: "http://127.0.0.1:80/bdmap/css/bmap.css"}).appendTo("head"); //引入css
loadMap();
}); //加载js文件
}else{ //在线
$.getScript("http://api.map.baidu.com/api?v=2.0&ak=xxxxxxxxx",function(){ //加载在线js,成功后执行回调函数
loadMap();
}); //加载js文件
} }); });
</script>

用Ping.js判断是否联网。用Jquery的$.getScript( url [, success(script, textStatus, jqXHR) ] )加载js。如果引入的js和其他js必须按照一定顺序则在$.getScript()回调函数中再执行$.getScript()。

Js判断是否联网引入不同js的更多相关文章

  1. js判断是否联网

    // navigator.onLine if (navigator.onLine){ //正常工作 console.log("在线状态............................ ...

  2. js 仿微信投诉—引入vue.js,拆分组件为单个js

    效果 页面目录 index.html <!DOCTYPE html > <html> <head> <meta charset="UTF-8&quo ...

  3. js判断是否是正整数,js判断是否是数字

    //判断字符串是否为数字 function checkRate(input) { var re = /^[0-9]+.?[0-9]*$/; if (!re.test(input.rate.value) ...

  4. 经典JS 判断上传文件大小和JS即时同步电脑时间

    我也是新手,还是一个JS笨,有一些网站要实现的功能要自己写么? 答案是不会,去问同事大佬吧,闲简单.就在晚上看了一些其他大佬们写的JS效果, 代码很少.占用网站CPU也小的多.可以一用, 废话少扯.代 ...

  5. js模版引擎handlebars.js实用教程——如何引入Handlebars.js

    返回目录 Jquery插件,第一步当然要引用Jquery啦,然后引用Handlebars.js即可,仅仅需要这两个js文件. <script type="text/javascript ...

  6. js判断中文字符串长度和js截取中文字符串

    //获取字符串长度String.prototype.strLen = function() { var len = 0; for (var i = 0; i < this.length; i++ ...

  7. js判断苹果安卓操作系统,js更换css

    //判断是哪个操作系统 if(plus.os.name=="Android"){ var lsyshowline=document.getElementById("lsy ...

  8. js判断上传文件大小

    下面提供三款网页特效判断上传文件大小哦,这三种方法是现在限制文件上传大小比较好的方法,可以在客户上传文件时限制上传文件大小判断处理<!doctype html public "-//w ...

  9. 通过JS判断联网类型和连接状态

    通过JS判断联网类型和连接状态 中国的移动网络环境复杂,为了给用户带去更好访问体验,开发者希望能了解用户当前的联网方式,然后给用户一个符合当前网络环境的请求结果. W3C的规范中给出了一个方法来获得现 ...

随机推荐

  1. mysql 主从同步-读写分离

    主从同步与读写分离测试 一.  实验环境(主从同步) Master                   centos 7.3              192.168.138.13 Slave     ...

  2. HTML5笔记——formData

    注:formData中的数据在控制台上的console里面是打印不出来的,只能在控制台的network里面查看到具体的发送数据和发送选项 文章出处:梦想天空 XMLHttpRequest Level ...

  3. mysql数据库从删库到跑路之mysql其他

    一 IDE工具介绍 生产环境还是推荐使用mysql命令行,但为了方便测试,可以使用IDE工具 下载链接:https://pan.baidu.com/s/1bpo5mqj 掌握: #1. 测试+链接数据 ...

  4. 搭建 maven 项目 搭建 maven web 项目及遇到 JDK 的问题

    临时起意搭建一个 maven web 项目.使用的servlet 3.0 及 1.8 JDK. maven 默认创建了一个JDK 1.5 版本的项目. 注意此处选择一下WAR包.不然在配置中配置的话会 ...

  5. PHP的pm、pm.max_requests、memory_limit

    1.php-fpm.conf中的pm pm是来控制php-fpm的工作进程数到底是一次性产生固定不变(static)还是在运行过程中随着需要动态变化(dynamic).众所周知,工作 进程数与服务器性 ...

  6. BigInteger和Complex:NET 4新增数据类型

    BigInteger和Complex是.NET 4中新增的两种值类型,他们位于System.Numeric命名空间下,需要单独添加引用. BigInteger BigInteger类型是不可变类型,代 ...

  7. PKU 2352 Stars(裸一维树状数组)

    题目大意:原题链接 就是求每个小星星左小角的星星的个数.坐标按照Y升序,Y相同X升序的顺序给出由于y轴已经排好序,可以按照x坐标建立一维树状数组 关键是要理解树状数组中的c[maxn]数组的构成方式, ...

  8. JavaWeb 如何在web.xml中配置多个servlet

    15:34:42 <servlet> <description></description> <display-name>ListMusicServle ...

  9. CSS3、SVG、Canvas、WebGL动画精选整理

    一.CSS3动画 名称 用途 链接 阴影波纹特效 1.元素hover效果 2.突出表现效果 http://www.jq22.com/code80 横板导航菜单动画 导航菜单 http://www.jq ...

  10. convention over configuration

    惯例优先原则:也称为约定大于配置或规约大于配置(convention over configuration),即通过约定代码结构或命名规范来减少配置数量,同样不会减少配置文件:即通过约定好默认规范来提 ...