C#发现之旅 - 高性能ASP.NET树状列表控件(中)

第一段HTML代码块

若控件的“DynamicLoadChildNodes”属性值为true，也就是控件运行在客户端动态加载子节点，则输出支持客户端动态加载子节点的HTML代码，首先输出一个名为“SkyTreeViewControlTempXML”的XML数据岛标签，并将它的 “onreadystatechange“事件绑定到”SkyTreeViewControlDynamicLoadChildNodes”的 JavaScript函数上。这里还定义了一个名称为“SkyTreeViewControlDyanmicRootNodeID”的全局变量，用于指明是哪个节点正在加载在节点。这里输出的HTML代码内容为

<!--　

　　　　定义一个XML数据岛标签
　　　　
　　　　当动态加载子节点时使用该XML数据岛来加载定义子节点的XML文档，

　　　　XML数据岛是IE特有技术，其他浏览器可能不支持。

-->
<xml　id='SkyTreeViewControlTempXML'
　　　　　onreadystatechange='SkyTreeViewControlDynamicLoadChildNodes()'　></xml>
<script　language=javascript>

//---------　开始定义动态加载子节点使用的JavaScript　代码---------------------

//　当前动态加载子节点的根节点对象编号
var　SkyTreeViewControlDyanmicRootNodeID　;

//　动态加载子节点
function　SkyTreeViewControlDynamicLoadChildNodes()
{
　　　　//　获得加载子节点定义数据的XML数据岛对象
　　　　var　xml　=　document.getElementById(　'SkyTreeViewControlTempXML'　);
　　　　if(　xml　==　null　)
　　　　{
　　　　　　　　return　;
　　　　}
　　　　if(　xml.readyState　!=　'complete'　)
　　　　{　　　　//　此时说明XML数据岛正处于工作状态，取消当前操作
　　　　　　　　return　;
　　　　}
　　　　//　获得当前正在处理的树状列表节点对象
　　　　var　RootNode　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+　'_text'　);
　　　　if(　RootNode　==　null)
　　　　　　　　return　;
　　　　var　html　=　'';
　　　　var　errorflag　=　false;

　　　　//　获得包含XSLT代码的XML数据岛对象
　　　　var　xsl　=　document.getElementById(　'SkyTreeViewControlXSLT');
　　　　if(　xsl　==　null　)
　　　　{
　　　　　　　　//　未找到XSLT文档则设置错误信息
　　　　　　　　html　=　'缺失XSLT数据';
　　　　　　　　errorflag　=　true　;
　　　　}
　　　　else　if(　xml.XMLDocument.parseError.errorCode　!=　0)
　　　　{
　　　　　　　　//　若加载定义子节点的XML文档错误则设置错误信息
　　　　　　　　html　=　'错误:'　+　xml.XMLDocument.parseError.reason
　　　　　　　　　　　　　　　　+　'['　+　xml.XMLDocument.parseError.url　+　']'　;
　　　　　　　　errorflag　=　true　;
　　　　}
　　　　else
　　　　{
　　　　　　　　if(　xml.XMLDocument.documentElement　==　null　)
　　　　　　　　{
　　　　　　　　　　　　html　=　'未找到根节点';
　　　　　　　　　　　　errorflag　=　true　;
　　　　　　　　}
　　　　　　　　else
　　　　　　　　{
　　　　　　　　　　　　//　将当前节点的HTML标签的编号保存到XML文档中。
　　　　　　　　　　　　xml.XMLDocument.documentElement.setAttribute(
　　　　　　　　　　　　　　　　'RootID'　,　
　　　　　　　　　　　　　　　　SkyTreeViewControlDyanmicRootNodeID　);

　　　　　　　　　　　　//　执行XSLT转换，生成用于显示子列表的HTML字符串
　　　　　　　　　　　　html　=　xml.XMLDocument.transformNode(　xsl.XMLDocument　);
　　　　　　　　}
　　　　}
　　　　//　将当前节点的“正在加载”的字样删掉
　　　　var　lbl　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+'_Loading');
　　　　if(　lbl　!=　null　)
　　　　{
　　　　　　　　if(　errorflag　)
　　　　　　　　{
　　　　　　　　　　　　lbl.innerHTML　=　'<br　/>'　+　html　;
　　　　　　　　　　　　return　;
　　　　　　　　}
　　　　　　　　//　将动态生成的HTML代码输出到HTML页面中
　　　　　　　　lbl.insertAdjacentHTML('afterEnd',　html　);
　　　　　　　　lbl.parentNode.removeChild(　lbl　);
　　　　}
　　　　else
　　　　{
　　　　　　　　//　将动态生成的HTML代码输出到HTML页面中
　　　　　　　　RootNode.insertAdjacentHTML('afterEnd',　html　);
　　　　}

　　　　//　获得节点的展开点图片对象
　　　　var　myExpend　　　　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+　'_expend');
　　　　//　获得节点的图标图片对象
　　　　var　myIcon　　　　　　　　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+　'_icon');
　　　　//　获得节点的文本对象
　　　　var　myText　　　　　　　　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+　'_text');
　　　　//　获得子节点表格　　　　
　　　　var　myTable　　　　　　　　=　document.getElementById(　SkyTreeViewControlDyanmicRootNodeID　+　'_table');

　　　　if(　myExpend　!=　null　
　　　　　　　　&&　myIcon　!=　null
　　　　　　　　&&　myText　!=　null　
　　　　　　　　&&　myTable　!=　null　)
　　　　{
　　　　　　　　//　将当前节点的控制图标从收缩状态改变为展开状态
　　　　　　　　var　SrcBack　=　myIcon.src　;
　　　　　　　　myIcon.src　=　myIcon.getAttribute('SrcBack');
　　　　　　　　myIcon.setAttribute(　'SrcBack'　,　SrcBack　);
　　　　　　　　
　　　　　　　　SrcBack　=　myExpend.src　;
　　　　　　　　myExpend.src　=　myExpend.getAttribute('SrcBack');
　　　　　　　　myExpend.setAttribute(　'SrcBack'　,　SrcBack　);

　　　　　　　　//myTable.scrollIntoView(　false　);
　　　　}

　　　　SkyTreeViewControlDyanmicRootNodeID　=　null;

}//function　SkyTreeViewControlDynamicLoadChildNodes()

//--------　本段JavaScript　定义结束--------------------------

</script>