zoukankan      html  css  js  c++  java
  • js动态检测加载 JQ

    var jqcdnurl = 'https://cdn.bootcss.com/jquery/3.2.1/jquery.js';
    //控制台输出
    function log() {
        for (var index in arguments) {
            console.log(arguments[index]);
        }
    }
    //js加载 fun
    function loadjs() {
        arguments[0]();
        for (var index in arguments) {
            if (index != 0) {
                document.write("<scr" + "ipt src="" + arguments[index] + ""></sc" + "ript>");
                log("java script :" + arguments[index] + " -> please waiting,loading...↓")
            }
        }
    }
    
    //异常处理函数 fun
    function catchErro() {
        try {
            if (arguments.length > 0) {
                arguments[0]();
            }
    
        } catch (err) {
            if (arguments.length > 1) {
                arguments[1](err);
            }
    
        } finally {
            if (arguments.length > 2) {
                arguments[2]();
            }
    
        }
    }
    
    //是否具有jq 环境 fun
    function isHasJq() {
        return typeof (jQuery) == "undefined" ? false : true;
    }
    
    //动态加载js fun
    function loadScript(url, callback) {
        var script = document.createElement("script");
        script.type = "text/javascript";
        if (typeof (callback) != "undefined") {
            if (script.readyState) {
                script.onreadystatechange = function () {
                    if (script.readyState == "loaded" || script.readyState == "complete") {
                        script.onreadystatechange = null;
                        callback();
                    }
                };
            } else {
                script.onload = function () {
                    callback();
                };
            }
        };
        script.src = url;
        document.body.appendChild(script);
    }
    
    //是否存在此src js fun
    function isHasjsBysrc(url) {
        var ishave = false;
        var headscripts = document.getElementsByTagName('script');
        for (var index in headscripts) {
    
    
            if (headscripts[index].src == url) {
                ishave = true
            }
            log("引入脚本:" + headscripts[index].src);
    
        }
        log("JQ 脚本状态:" + ishave);
        return ishave;
    }
    //加载jqcdn #废除 fun
    function appendJQCDN() {
        if (!isHasjsBysrc("https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js")) {
            var head = document.head || document.getElementsByTagName('head')[0];
            var script = document.createElement('script');
            var style = document.createElement('style');
            script.setAttribute("src", "https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js");
            style.innerHTML = '';
            head.appendChild(script);
            head.appendChild(style);
            log("JQ CDN 引入成功! ");
        }
    }
    
    //动态加载JQ并执行 fun
    function dynamicAddJQExcute(excuteFUN) {
        loadScript(jqcdnurl, excuteFUN);
        log("JQ ALL Ready!");
    }
    
    
    //加载js
    loadjs(function () {
        log("cs_base-js load ok!", "loading done");
    }, "js/csopp.js", "js/cstip.js");
    
    //JQ执行函数
    function ExcuteCs(fun) {
        if (isHasJq()) {
            $(document).ready(function () {
                fun();
            });
        } else {
            dynamicAddJQExcute(function () {
                $(document).ready(function () {
                    fun();
                });
            });
    
        }
    }
    
    document.onload = catchErro(
        function () {
            if (isHasJq()) {
                log("JQ ALL Ready!");
            } else throw ex;
        },
        function (ex) {
            log("没有引入 JQ 环境,请引入JQ 环境", "动态引入.... (未在网络状态则无法动态引用)" ,"建议手动引入,否则造成未知错误,对此不负任何责任");
        }
    );
    
    
    
    ExcuteCs(function(){
    	$("body").html("TEST");
    });


  • 相关阅读:
    Thinkphp3.2.3如何加载自定义函数库
    mysql 字段引号那个像单引号的撇号用法
    php cli模式学习(PHP命令行模式)
    Django model 表与表的关系
    Django model 字段详解
    Django model 中的字段解释
    python系列-1 字符串操作
    nginx-匹配规则
    ansible系列3-pyYAML
    ansible系列2-常用命令
  • 原文地址:https://www.cnblogs.com/embaobao/p/10720849.html
Copyright © 2011-2022 走看看