动态加载js,实例(不全)

js加载器动态加载外部Javascript文件 js加载器动态加载外部Javascript文件 JsLoader.jsvar var MiniSite=new Object(); /** * 判断浏览器 */ MiniSite.Browser={ ie:/msie/.test(window.navigator.userAgent.toLowerCase()), moz:/gecko/.te 阅读详情


其中: 异步加载js,并且需要加载完成后调用其中的方法。所以需要判断 js什么时候加载完毕

详见 loadJs(...)方法

正常思考逻辑

1.确保iframe能相互调用

2.确保js方法本身确实没有问题

3.确保 调用方法前 ,js加载完毕

4.兼容浏览器

5.其它原因可能会加载失败(网络缓慢)

网络慢的问题:

1.提示用户刷新页面

2.延迟 重新加载


index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>火车后台</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
	</head>
	</body>
	<script type="text/javascript">
	  function parentFram(){
	  	// document.getElementById("main").contentWindow.showPop();
	  	var str = ''
	  		+'<div id="pop" style="display:none;background:#fff;float:right;width:260px;border:1px solid #e0e0e0;font-size:12px;position: fixed;right:10px;bottom:10px;margin:0;padding:0;">'
			+'<div id="popHead" style="line-height:32px;background:#EAF30B;border-bottom:1px solid #e0e0e0;position:relative;font-size:12px;padding:0 0 0 10px;margin:0;padding:0;">'
			+'<a id="popClose" title="关闭" style="position:absolute;right:10px;top:1px;margin:0;padding:0;">关闭</a>'
			+'<h2 style="font-size:14px;color:#F32D2D;line-height:32px;height:32px;margin:0;padding:0;">温馨提示</h2>'
			+'</div>'
			+'<div id="popContent" style="padding:5px 10px;margin:0;padding:0;">'
			+'<dl>'
			+'<dt id="popTitle"><a href="http://yanue.info/" target="_blank" style="line-height:24px;font-size:14px;font-family:微软雅黑;color:#333;font-weight:bold;text-decoration:none;margin:0;padding:0;">这里是参数</a></dt>'
			+'<dd id="popIntro" style="text-indent:24px;line-height:160%;margin:5px 0;color:#666;mmargin:0;padding:0;">这里是内容简介</dd>'
			+'</dl>'
			+'<p id="popMore" style="text-align:right;border-top:1px dotted #ccc;line-height:24px;margin:8px 0 0 0;"></p>'
			 +'</div>'
			+'<br/><br/>';
	    var popDiv=document.createElement('div');
            popDiv.id="pop11";
            popDiv.style.position = 'fixed';
            popDiv.style.float = 'right';
            popDiv.style.bottom = '10px';
            popDiv.style.margin = 0;
            popDiv.style.padding = 0;
            popDiv.innerHTML = str;
	  	var oHead1 = document.getElementById("main").contentWindow.document.getElementsByTagName("body")[0]; 
	  	var scriptTag = document.getElementById("main").contentWindow.document.getElementById("pop");
	  	
	  	if(!scriptTag){
		  	oHead1.appendChild(popDiv)
	  	}
	  	// 加载js
	  	loadJs("script1","/js/jquery-1.4.2.min.js",function(){
	  		loadJs("script2","/js/back/yanue.pop.js",function(){
	  			document.getElementById("main").contentWindow.showPop();
	  		});
	  	});
	  }
	
	// 加载js
	
	function loadJs(id,url,callback){
		var oHead = document.getElementById("main").contentWindow.document.getElementsByTagName("head")[0]; 
		var oScript= document.createElement("script"); 
	    oScript.id = id;
	    oScript.async = "async"; 
	    oScript.type = "text/javascript"; 
	    oScript.src=url; 
	    
	    var oTag1 = document.getElementById("main").contentWindow.document.getElementById(id);
	    
	  	if(!oTag1){
		  	oHead.appendChild(oScript);
	  	}
	    oScript.onload = oScript.onreadystatechange = function(){ 
			if ((!this.readyState) || this.readyState == "complete" || this.readyState == "loaded" ){   
				callback();
			}else{
				alert("can not load the "+url+" file");
				// setTimeOut('','3000'); 重新加载
		    }
	 	}
	}
</script>
	<frameset rows="64,*" frameborder="NO" border="0" framespacing="0">
		<frame src="/trainBack/indexTop" noresize="noresize" frameborder="NO"
			name="topFrame" scrolling="no" marginwidth="0" marginheight="0"
			target="main" />
		<frameset cols="200,*" rows="10000,*" id="frame">
			<frame src="/trainBack/indexLeft" name="leftFrame"
				noresize="noresize" marginwidth="0" marginheight="0" frameborder="0"
				scrolling="auto" target="main" />
			<frame src="/trainBack/indexRight" id="main" name="main"
				marginwidth="0" marginheight="0" frameborder="0" scrolling="auto"
				target="_self" />
		</frameset>
	</frameset>
	<noframes>
		<body>
		</body>
	</noframes>
</html>

left.jsp

parent.parentFram();




ExtJs 模块化动态加载js实例解析(一) 大多数web应用系统都会包含功能菜单和显示页面,功能菜单可以是页面左面的一棵树,也可以是一个可以切换的多标签页,而显示页面无非就是一个空白区域,点击相应的功能菜单,切换不同的内容。     经常看到有人讨论如何用Ext加载iframe,这不失为一种简便的办法,但是它的弊端也是显而易见的。     1.每个页面都需要引用庞大的Ext类库,这样的系统在局域网里还可以接受,但作为一个公网系统就让人无 阅读详情

相关推荐

JavaScript惰性加载优化实例

这个排查的思路很通用,大部份性能问题都可以从这里着手,如果是前端的新朋友,那么建议从开头编写完代码之后,多依着下面的排查思路看看自己的代码执行步骤,然后思考,会有意想不到的收获。-- 使用原生loading属性 -->

大泽九章 807

页面加载不全,检查页面代码发现代码缺少/js不能起作用

页面加载不全

m0_56965737的博客 732

JavaScript动态加载JS与CSS文件详解

本章系统讲解了如何通过动态创建<script>和<link>元素实现 JS 与 CSS 的按需加载,并深入分析了加载过程中的事件处理、资源控制、封装复用以及错误处理策略。这些技术不仅适用于单页应用的模块化加载,也广泛应用于插件系统、主题切换、延迟加载等高级场景。在后续章节中,我们将进一步探讨使用fetch和进行资源加载的技术方案,以及如何结合浏览器缓存机制和 CDN 加速,实现更高效的前端资源管理策略。

weixin_31715353的博客 1213

记一次加载js不全报错的原因总结

1、运营商广告 dns 劫持2、浏览器本身并发数3、服务器配置keepAliveTimeout=04、加载文件过大5、 转载于:https://www.cnblogs.com/y896926473/p/9971460.html

weixin_34021089的博客 1457

【首份】2023年30米分辨率土地利用遥感监测数据

为了恢复和重建我国土地利用变化的现代过程,更好地预测、预报土地利用变化趋势,地球资源数据云以美国陆地卫星Landsat 遥感影像数据作为主信息源,结合Sentinel系列数据,通过人工目视解译和机器学习方法,建立了国家尺度1:10 万比例尺多时期土地利用/土地覆盖遥感监测数据库(CNLUCC)因早期Landsat数据时空覆盖缺失,1972-1977年合成第一期数据,1978-1985年合成第二期数据,1986年起每年度生成一期数据。投影:Albers正轴等面积双标准纬线圆锥投影南标准纬线:25°N。

地球资源数据云的官方博客 3678

VScode搭建Opencv(C++开发环境)

VScode配置Opencv一、准备软件二 、下载软件1、MinGw下载2、 Cmake下载3、Opencv下载三、编译1、cmake-gui2、make3、install四、 VScode配置1、launch.json2、c_cpp_properties.json3、tasks.json五、测试 用了半天事件,看了各种的博客终于配置成功了,在这里记录并分享一下,让更多的人少走弯路。 本次环境是Win 10. 一、准备软件 我们本次用到的3个软件,(建议读者文件路径,文件版本 尽量都和我相同,这样不容易出错

河旬的博客 8万+

js加载不完的问题

靠浏览器去判断有时候不准确。腾讯的一位网友说他们的BADJS分析发现,很多的JS报错,都是因为JS文件没有正常加在完导致的。 他们的方法是在文件底部做一个全局的勾子,发现浏览器判断加载完成,但是这个勾子不存在的话,就会重新发起请求。 网友司徒正美给出的方法是: dom.here || (function(dom){ //这是代码 ...

未知的方向 1026

如何使用ArcGIS Pro制作带基底三维地图

点击运行生成范围线,因为之前对高程进行了夸大,导致生成的范围线和地形边缘不重合,我们打开范围线的图层属性,选择高程选项卡,要素位于选择地面上,如下图所示。目前制作的三维地图下面是空的一片,现在添加一个基底,在工具箱内点击“3D Analyst工具\栅格\转换\栅格范围”,调用栅格范围工具,如下图所示。打开ArcGIS Pro,新建一个局部场景,在高程表面下,地面上点击右键,选择添加高程源图层,将需要制作三维地图的DEM数据加载进来,如下图所示。在要素图层菜单内,类型选择绝对高度,如下图所示。

3978

Nginx+Tomcat代理环境下JS无法完全加载问题

问题原因 Nginx代理后会有相应的代理缓存区,缓存区默认只有几十K,某些版本的nginx默认设置中没有相关处理,导致部分文件代理是会出现加载不全的现象,不仅仅是JS文件。只是因为框架的JS文件略大,所以经常出现类似问题。 问题解决 Nginx.conf中配置 proxy_buffer_size 128k; proxy_buffers 32 128k; proxy_busy_buffers_size 128k; ...

我的博客 689

clumsy一款模拟弱网的工具

利用封装 Winodws Filtering Platform 的WinDivert 库, clumsy 能实时的将系统接收和发出的网络数据包拦截下来,人工的造成延迟,掉包和篡改操作后再进行发送。无论你是要重现网络异常造成的程序错误,还是评估你的应用程序在不良网络状况下的表现,clumsy 都能让你在不需要额外添加代码的情况下,在系统层次帮你达到想要的效果。

klb5555的专栏 2551

分支界定法(branch and bound)与背包问题的代码实现

分支界定法(branch and bound)与背包问题的代码实现 LastEditTime: - 2021.2.3 不卖茶的吴龙茗茶 分支界定法是一种在整数规划中常用的算法,其主要思想为将大问题分割成小问题进行求解。分支界定法是围绕着一个二叉树进行的,以背包问题为例: 假设小明有一个背包,其总的容积为30,小明有三件东西可以带,三件东西的体积分别为:10,15,20。求问小明如何能够在背包中装下更大体积的物品? .

小吴同学的小屋 1885

javascript中动态加载js文件多种解决办法

var head = document.head                 || document.getElementsByTagName("head")[0]|| document.documentElement;      var script = document.createElement("script");      script.setAttribute("type",

yinxianluo的专栏 1万+

【matlab】基于 Simulink 的空调恒温控制系统仿真建模

本文介绍了基于Simulink的空调恒温控制系统仿真建模方法。系统采用PID控制算法,通过传感器测量温度、控制器计算信号、执行器调节功率来实现恒温控制。文章详细阐述了Simulink模型搭建步骤,包括PID控制器、房间热力学特性模拟等模块的实现,并提供了测试流程和多种实际部署场景。该方法可有效验证控制算法性能,优化系统设计,适用于家用、商用、工业及汽车空调系统。未来可结合智能算法和节能优化技术进一步提升系统性能。

走向CTO的路上... 919

动态加载 JS 文件

动态加载JS文件是一种优化页面加载速度和提高用户体验的重要方式,但也需要注意文件路径、文件大小、兼容性和安全性等问题。开发者可以通过createElement()方法、appendChild()方法、XMLHttpRequest对象和eval()函数等方式来实现动态加载JS文件,具体实现方法可以根据需求和实际情况进行选择和调整。

tyxjolin的专栏 1万+

2026年寒武纪数字IC笔试试卷带答案

本文摘要: 该数字IC设计测试卷包含单选题(30分)、波形分析题(15分)、多选题(30分)三类客观题,覆盖时序约束、半导体工艺、状态机、数制转换、同步复位等核心知识点。重点考察:1)跨时钟域处理(如异步FIFO、格雷码应用);2)时序分析(建立/保持时间、时钟约束指令);3)低功耗设计技术(时钟门控、DVFS);4)寒武纪MLU架构特性(张量核、混合精度计算)。解析强调工程实践要点,如异步复位需同步释放、建立时间违例与频率的关联性等。试题难度梯度明显,既包含基础概念辨析(如Moore/Mealy状态机),

Open 223

16、树莓派Pico W:蓝牙与Wi-Fi应用指南

本文介绍了树莓派Pico W在蓝牙与Wi-Fi通信方面的应用,涵盖蓝牙配对原理、使用HC-06模块实现手机远程控制LED和传输内部温度,以及通过Wi-Fi进行网络连接、扫描和UDP协议下的设备控制。文章包含详细电路连接、代码实现与测试步骤,并提供拓展建议、常见问题解决方法及开发注意事项,帮助读者快速掌握基于Pico W的无线通信项目开发,适用于物联网入门与实践场景。

sun99的博客 289

用javascript动态加载不同css/js文件

先导入js文件。DynamicLoad.js文件代码如下:function DynamicLoad(){ //属性 var Self=this;      //对象自身  //功能:加载指定的文件 //参数:src——需要被加载的文件 //返回:(无) this.Load=function(src) {  if(Self.IsLoaded(src))    //判断该文件是否已经加载了  

dcju002的专栏 4429

廖雪峰Python教程[完整版]

廖雪峰的python教程整理的,已经排好版了,而且还是完整的,适合小白

如何通过JavaScript动态加载js

在Web开发时,有可能会遇到这么一种情况:我们需要通过一个js文件中引用另一个js文件中的函数,可是另一个函数有没有办法在页面中通过该<script>标签加载。于是,我们有了通过js动态加载js文件的需求。下面提供一种方案。 方法比较简单,具体实例详见代码: 文件1:demo....

chenghuo9876的博客 342

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

JavaScript重构(二):JS的动态加载

前一节留下了一个问题,如果JS分门别类也清晰了,那我现在需要在必要的情况下才加载某一模块的JS,这个怎么实现呢?   方法一,最简单也是最容易被接受的方法,通过后台代码来控制,还是少些复杂的JS吧,通过一个标签、一个分支判断,就可以做到,何乐而不为呢?   方法二,如果要

四火专栏 3206

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

javaScript动态加载js文件

1、利用原生js代码加载js文件 function loadJS( url, callback ){ var script = document.createElement('script'),fn = callback || function(){}; script.type = 'text/javascript'; if(script.readyState){//IE ...

chaopingyao的博客 1103

js实用方法记录-js动态加载css、js脚本文件

动态加载js文件到head标签并执行回调 方法调用:dynamicLoadJs(‘http://www.yimo.link/static/js/main.min.js’,function(){alert('加载成功’)}); /** * 动态加载JS * @param {string} url 脚本地址 * @param {function} callbac...

大智若愚的博客 2669

JS动态加载JS

1、直接document.write     document.write(""); 2、动态改变已有script的src属性     s1.src="test.js" 3、动态创建script元素     var oHead = document.getElementsByTagName('HEAD').item(0);     var oS

it_man的专栏 1865

动态加载JavaScript文件

目录 配置 无脑方法! 逆袭之道! 一块蛋糕! 结论 源代码 JavaScript文件的动态加载是您必须拥有的非常有用的工具之一。它允许您通过将阻止脚本从加载过程中移出(通常称为“延迟加载”)来优化网页性能,并仅在用户需要时加载脚本(通常称为“按需加载”)。如果您明智地使用此工具,它将大大提高您的页面性能。 配置 让我们定义我们的示例模型,我们将从定义需要动态加载的远程文件开始。这是“remote.js”文件的定义: // this is going to be executed wh

寒冰屋的专栏 2394

Js 动态加载jQuery

可以在javascript 里面<a onclick="function onclick(){tagshow(event, %E5%8A%A8%E6%80%81);}" href="javascript:;" target="_self">动态加载<a onclick="function onclick(){tagshow(event, jquery);}" hre

lansdmn的专栏 5294

使用javascript动态加载外部css或js文件

    几天没写东西了,这几天真是比较懒惰,今天总算写了点小东西呵呵,很简单的东西,也参考了很多网络资源,动态加载css或js文件的实际应用有很多,不用我介绍了,大家肯定都感受过,比如不刷新页面切换css,一些大的门户网站的js文件也是动态加载的,比如网易等等。其实原理非常简单无法就是dhtml罢了,废话不说了,放代码。csdn博客又出问题了,不能插入html了,晕,真不好用。大家将就着看吧。

孙钰佳的博客 2724
上一篇: 动态加载js,css文件(跨iframe)
下一篇: iframe跨域高度自适应
_hug
博客等级 码龄17年 24粉丝 11原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值