標籤：firefox extjs 動態載入js檔案 window組件
動態載入js檔案可以減輕瀏覽器的壓力，本例使用了Ext.window.Window組件，該組件的學習地址：http://blog.csdn.net/z1137730824/article/details/38538277
具體實現步驟：
（1）建立dynamic.jsp檔案
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>My JSP '1HelloWorld.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css"><script type="text/javascript" charset="utf-8" src="js/extjs/ext-all-debug.js"></script><script type="text/javascript" charset="utf-8" src="js/extjs/ext-lang-zh_CN.js"></script><script type="text/javascript" charset="utf-8" src="MyExt4Study/dynamic.js"></script> </head> <body> </body></html>（2）建立dynamic.js和MyWindow.js檔案，注意路徑
檔案具體內容：
dynamic.js
Ext.onReady(function(){//動態載入js檔案步驟：//1、在js/extjs/添加檔案夾(ux)，在ux檔案夾中添加自己的檔案//2、在js/extjs/ux中編寫擴充的組件//3、啟用Ext的動態載入機制，設定載入路徑//4、建立類的執行個體並使用Ext.Loader.setConfig({enabled:true,paths:{//可以載入多個jsmyux:'js/extjs/ux'//要載入的js所在的路徑}});//建立執行個體Ext.create('js.extjs.ux.MyWindow',{title:'修改動態載入組件的標題'}).show();});MyWindow.js
//define的類名，一點要嚴格按照包層次路徑去編寫Ext.define('js.extjs.ux.MyWindow',{extend:'Ext.window.Window' , //繼承Ext的window類title:'我是動態載入進來的組件', width:300, //這是表單的寬度 height:'50%', //高度和寬度值可以是數值型的，也可以是字串型，用字串型的比較好 layout: //布局 { type: 'fit'//Auto(預設),card,fit,hbox,vbox,anchor,table // align: 'left' }, plain:true,//設定視窗背景為透明 constrain:true,//設定視窗不超出瀏覽器邊界 // constrainHeader:true,//設定視窗的標題不超出視窗的邊界，標題之外可以超出 modal:true,//設定視窗時模態視窗 icon:'js/extjs/icons/icon.png',//設定表徵圖，值為表徵圖的路徑 // iconCls:'',//CSS樣式 x:50, //設定表單在瀏覽器中顯示的位置 y:50, autoScroll:true,//當表單中的內容很多的時候顯示捲軸 html:'這是表單中顯示的文字',//表單中顯示的文字，可以使Html文本 renderTo:Ext.getBody()//新建立的組件渲染到什麼位置 });（3）啟動伺服器進行測試
開啟FireFox控制台，選擇網路，查看載入：
Extjs學習----------動態載入js檔案（減輕瀏覽器的壓力）
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
