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");
});
js动态检测加载 JQ的更多相关文章
- 动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数
动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数, 在很多场景下,我们需要在动态加载JS文件的时候,根据加载的状态来进行后续的操作,需要在JS加载成功后,执行另一方法,这个方法是依托在加 ...
- nginx实现动态分离,解决css和js等图片加载问题
改帖专门为使用nginx,通过nginx把请求转发到web服务器再返回客户端的时候,解决css和js和图片加载不出来的问题. 如果没安装nginx,请访问一下地址进行安装 http://www.cnb ...
- JS性能优化——加载和执行
JavaScript 在浏览器中的性能,可以认为是开发者所面临得最严重的可用性问题.这个问题因JavaScript的阻塞特性变得复杂, 也就是说当浏览器在执行JavaScript代码时,不能同时做其他 ...
- 关于js css html加载顺序整理
1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控. 正常的网页加载流程是这样的. 浏览器一边下载HTML网页,一 ...
- js判断图片加载完成后获取图片实际宽高
通常,我们会用jq的.width()/.height()方法获取图片的宽度/高度或者用js的.offsetwidth/.offsetheight方法来获取图片的宽度/高度,但这些方法在我们通过样式设置 ...
- 高性能JS笔记1——加载执行
一.脚本位置 1.Script标签尽可能放到Body底部,以减少脚本文件下载对整个页面UI渲染的影响. 2.Script标签永远不要紧跟Link标签后面. 二.组织脚本 1.合并多个文件在一个Scri ...
- js优化 ----js的有序加载
说到有序加载,我们先来说说js的无序加载: <script src="jquery/jquery-1.4.1.js" type="text/javascript&q ...
- esri-leaflet入门教程(5)- 动态要素加载
esri-leaflet入门教程(5)- 动态要素加载 by 李远祥 在上一章节中已经说明了esr-leaflet是如何加载ArcGIS Server提供的各种服务,这些都是服务本身来决定的,API脚 ...
- js的异步加载你真的懂吗
面试高频之js的异步加载 讲这个问题之前, 我们从另一个面试高频问题来切入, 我们的web页面从开始解析到页面渲染完成都经历了什么 ? 1 , 创建document对象, 开始解析页面, ...
随机推荐
- 检测浏览器(BOM)以及地址栏网址的API
navigator.userAgent //检测浏览器的版本以及那个厂商的 (不怎么准,你比如360经常跟别人干架,所以别人检测到360浏览器就提示浏览器危险,所以360就自己修改了) //分解这个地 ...
- linux lsof/netstat查看进程和端口号相关命令:
本文为博主原创,未经允许不得转载: 在linux操作时,经常要查看运行的项目的进程和端口号,在这里总结了以下常用到的相关命令: 1.查看系统运行的java项目,并查看进程号 这个用到的命令为: ps ...
- CCF计算机网络会议日期
SenSys: November 5-8 2017, Deadline: April 3, 2017 CoNEXT: December 12-15 2017, Deadline: June 12, 2 ...
- 每天一个小程序—0000题(python图像处理)
第 0000 题: 将你的 QQ 头像(或者微博头像)右上角加上红色的数字,类似于微信未读信息数量那种提示效果. 类似于图中效果 python中的pillow库是专门用于处理图像的. from PIL ...
- Git、GitHub、GitLab三者之间的联系以及区别
在讲区别以及联系之前先简要的介绍一下,这三者都是什么(本篇文章适合刚入门的新手,大佬请出门左转) 1.什么是 Git? Git 是一个版本控制系统. 版本控制是一种用于记录一个或多个文件内容变化,方便 ...
- snakemake使用笔记
snakemake是一个用来编写任务流程的工具,用python编写的,因此其执行的流程脚本也比较通俗易懂,易于理解. 一.从一个简单的例子开始 1.安装snakemake 安装snakemake的方法 ...
- tarjan 缩点(模板)
描述: 给定一个n个点m条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 注:允许多次经过一条边或者一个点,但是,重复经过的点,权值只计算一次. 思路: ...
- 关于JAVA中包装类的是什么类型传递这个问题的笔记
背景知识: 如果参数类型是原始类型,那么传过来的就是这个参数的一个副本,也就是这个原始参数的值.如果在函数中改变了副本的值不会改变原始的值. 如果参数类型是引用类型,那么传过来的就是这个参数的引用,这 ...
- hibernate的三种状态和缓存
hibernate的三种状态: 1.瞬时态:对象里面没有id值,对象与session没有关联 类似,把class类new出来,不存进session 2.持久态:对象里面有id值,对象与session关 ...
- 一般删除网页数据和jquery下使用Ajax删除数据的区别
1. 一般删除网页数据 就是指用户在点击删除的时候,会跳转到DeleteUser.ashx一般处理程序中,并且通过get传参的方式传递一个id的参数,然后在后台处理 <a href='Delet ...