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

分析: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. Linux kernel AESNI缓冲区溢出漏洞

    解决办法: CENT OS:升级系统内核. yum update kernel UBUNTU:升级系统内核. #到 Ubuntu网站http://kernel.ubuntu.com/~kernel-p ...

  2. beego——日志处理

    这是一个用来处理日志的库,它的设计思路来自于 database/sql,目前支持的引擎有 file.console.net.smtp,可以通过如下方式进行安装: go get github.com/a ...

  3. 基于bootstrap metronic-responsive-admin-dashboard-template 开发管理后台

    简单介绍 我们这个系统是基于bootstrap metronic-responsive-admin-dashboard-template 这个模板开发的.版本用的是metronic_v4.5.2 效果 ...

  4. fir.im 测试包下载工具--FIRReader 的图文介绍

    fir.im 是一个供开发者上传测试包(也可以是企业的正式包)的网站.该网站提供了接口访问应用资源.下面要介绍的这个应用对接了这些接口,供用户方便下载应用. 先来看下应用截图吧! 主要有以下功能点:1 ...

  5. Java-线程池专题(什么是线程池,如何使用,为什么要用)

    1.什么是线程池:  java.util.concurrent.Executors提供了一个 java.util.concurrent.Executor接口的实现用于创建线程池 多线程技术主要解决处理 ...

  6. c++之旅:继承

    继承 继承有关于权限的继承,多继承和虚继承 权限继承 权限继承有公有继承,保护继承和私有继承 公有继承 公有继承可以继承父类的public和protected属性和方法 #include <io ...

  7. NUMA架构的优缺点

    numa把一台计算机分成多个节点(node),每个节点内部拥有多个CPU,节点内部使用共有的内存控制器,节点之间是通过互联模块进行连接和信息交互.因此节点的所有内存对于本节点所有的CPU都是等同的,对 ...

  8. Web安全学习笔记之Nmap脚本编写

    0x00 Nmap脚本简介 夜无眠,看了一下Nmap官方的英文API文档(全是English),瞬间心态崩塌,不想吐槽它们的nmap官网前端太丑了=.=,但是都是大牛啊,挺敬佩开源开发者的. Nmap ...

  9. jquery阻止事件冒泡的方法

    $("table tbody").click(function(e) { e.preventDefault(); //阻止自身的事件,并不能阻止冒泡 e.stopPropagati ...

  10. Asp.net Core Windows部署

    一.  IIS 部署模式 1. 安装IIS服务 2. 下载安装Core SDK        https://www.microsoft.com/net/download/Windows/build3 ...