app-framework学习--动态管理panel

由于一个index写多有页面，压力过大。所以有了js解决方案,动态管理panel

<span style="color:#333333;">var panelUtil = {  
/********** 添加一个新的header  **********/  
addNewHeader : function (headerContent){  
$("#afui").append(headerContent);  
},  
/********** 添加一个新的panel  **********/  
addNewPanel : function (panelID,content,header,footer,load,unload,nav,aside){  
var div=div=('<div id="'+panelID+'" class="panel" data-header="'+header+'" data-footer="'+footer+'" data-load="'+load+'" data-unload="'+unload+'" data-aside="'+aside+'" data-nav="'+nav+'"></div>')  
.append(content);  
$("#content").append($div);  
},  
/********** 删除一个panelpanel  **********/  
removePanel : function (panelID){  
$("#content").find("#" + panelID).remove();  
},  
/********** 删除一个header  **********/  
removeHeader : function (headerID){  
$("#afui").find("#" + headerID).remove();  
},  
/********** 彻底销毁一个panel **********/  
destroy : function (headerID,panelID){  
$("#afui").find("#" + headerID).remove();  
$("#content").find("#" + panelID).remove();  
},  
}</span>

</spn>  

 使用方法如下：

创建一个header:

[javascript]  view plain  copy

 print ?

1. <span style="font-size:18px;"> panelUtil.addNewHeader("headerHtml")；</span>  

创建一个panel:

[javascript]  view plain  copy

 print ?

1. <span style="font-size: 18px;"></span><pre name="code" class="javascript"><span style="font-size: 18px;">panelUtil.addNewPanel("panelHtml")；</span>  

删除一个header:

[javascript]  view plain  copy

 print ?

1. <span style="font-size: 18px;"> panelUtil.removeHeader("hederid");</span>  

删除一个panel:

[javascript]  view plain  copy

 print ?

1. <span style="font-size: 18px;"> panelUtil.</span><span style="font-size: 18px; font-family: Arial, Helvetica, sans-serif;">removePanel("panelid");</span>  

销毁一个panel:

[javascript]  view plain  copy

 print ?

1. <span style="font-size: 18px;">panelUtil.</span><span style="font-size: 18px; font-family: Arial, Helvetica, sans-serif;">destroy(</span><span style="font-family: Arial, Helvetica, sans-serif; font-size: 18px;">"</span><span style="font-size: 18px; font-family: Arial, Helvetica, sans-serif;">hederid</span><span style="font-family: Arial, Helvetica, sans-serif; font-size: 18px;">",</span><span style="font-size: 18px; font-family: Arial, Helvetica, sans-serif;">"panelid");</span>