处理INamingContainer的项目框架

分享于 

3分钟阅读

Web开发

  繁體 雙語

介绍

本文将介绍在使用较老的ASP.NET 呈现框架中使用粗JavaScript客户端脚本和服务器端 INamingContainer 时,我已经开发的用于使工作更加轻松。

背景

将服务器控件呈现到实现 INamingContainer的容器中的客户端时,这将修改控件的ID。 具有'txtUsername'is的文本框通常会带有 is,它是控件位置的$ 表示形式的页层次结构。 比如,ctl_001$ctl_content1$txtUsername

要获取这里 ID,需要使用服务器端包括从服务器请求它。 这就限制了一些限制,比如停止脚本。

在下面的代码中,这不再是一个问题。

使用代码

下面是项框架代码:

var ctlHolder = function(id, ctl) {
 this.ID = id;
 this.Ctl = ctl;
}var ctlDef = function() {
 this.Items = new Array();
 this.Add = function(item) { this.Items[this.Items.length] = item; };
 this.Get = function(id) {
 for (var obj inthis.Items)
 if (this.Items[obj].ID == id)
 returnthis.Items[obj].Ctl;
 returnnull;
 }
 this.EndID = function(id) {
 var index = id.lastIndexOf('$');
 if (index == -1)
 index = id.lastIndexOf('_');
 if (index == -1)
 return id;
 elsereturn id.substring(index + 1);
 }
}var ctl = new ctlDef();function catalogItems(items) {
 if (items == null) items = document.getElementsByTagName('html');
 for (var obj in items) {
 var item = items[obj];
 if (item.id)
 ctl.Add(new ctlHolder(ctl.EndID(item.id), item));
 if (item.childNodes)
 catalogItems(item.childNodes);
 }
}

要在页面加载时使用这个框架,你需要调用" catalogItems"函数。 可以通过将以下属性添加到HTML文档的body 节点来实现这一点。

onload="catalogItems(null);"

一旦分类,你就可以用以下方法替换较长的document.getElementById 调用:

Old: document.getElementById('ctl_001$ctl_content1$txtUsername')
New: ctl.Get('txtUsername')

Points of Interest

我发现这个剧本非常快。 在当前项目中的一个大页面加载 300 K+,这里方法在 0.1秒内遍历所有节点和目录。

$ 符号命名约定不再在像MVC这样的最新框架中实施。