首页 > 网站 > WEB开发 > 正文

Razer的底层方法---加载页面

2024-04-27 15:08:07
字体:
来源:转载
供稿:网友

模块化开发可以用Ajax把需要的模块请求过来,并且把模块对应的js文件加载过来,于是我用面向对象的方法对其进行了封装

以下是封装的代码:

(function(window,undefined){	function commonFn(){		this.loadPage = function(args){			var _container = args.container;//容器			var pageUrl = args.pageUrl;//页面路径			var pageScript = args.pageScript;//页面对应的js文件			var onLoaded = args.onLoaded;//页面记载完成后回调函数			$.ajax({				url : pageUrl,				type : 'GET',				dataType : 'html',				timeout : 10000,				success : function(res){					//加载html页面					_container.append(res);					// 加载js文件                   			var pageScriptTmp = document.createElement("script");                   			pageScriptTmp.setAttribute('type','text/javascript');                    			pageScriptTmp.setAttribute("src", pageScript);                    			var documentHead = document.head;                    			if(documentHead == undefined) {                       				documentHead = document.getElementsByTagName("head")[0];                    			}                   			documentHead.appendChild(pageScriptTmp);                  					//js脚本加载完成后回调函数                    			pageScriptTmp.onload = pageScriptTmp.onreadystatechange = function(){                        			if(!this.readyState||this.readyState=='loaded'||this.readyState=='complete'){                            				onLoaded();                        			}                    			}				},				error : function(){					alert('页面出错了');				}			});		}	}	var commonFnObj = new commonFn();	window.$commonObj = commonFnObj;})(window)

以下是使用说明

$commonObj.loadPage ------ 请求模块

$commonObj.loadPage({	container ://模块容器【jquery对象】	pageUrl ://模块路径	pageScript ://模块对应的脚本文件	onLoaded ://模块加载完成后回调})

模块页面用div包裹


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表