你应该学习的4种ASP.NET AJAX JavaScript UI方法
以前我写的关于ASP.NET AJAX的文章很少谈起客户端功能，本文将仔细的看看ASP.NET AJAX中的JavaScript UI工具函数。这些方法非常有用，因为它们抽象了大多数有关浏览器兼容性的问题，为我们提供了一套友好的，连续的API。
特别的，我将向你展示一些使用addCssClass, getBounds, getLocation, 和 setLocation的例子，完成一些客户端UI任务。
轻松的添加和删除CSS类
一个被忽视的CSS特征是对同一个元素直接应用多个CSS类。例如，你可能参加过在线测试，测试结果中，正确的回答使用绿色显示，而错误的回答使用红色显示。你可以使用下面这个方法做到：
.answerResult{ font-weight: bold; }
.correct { color: green; }
.incorrect { color: red; }
Answer #1: <span class="answerResult correct">correct</span>Answer #2: <span class="answerResult incorrect">incorrect</span>这是一个非常漂亮的解决方法。标记是语义上的，为了避免重复，将高亮(highlight)与基本类型中分开。然而，如果我们需要在客户端操作它们，还有很多工作要做。
幸运的是，ASP.NET AJAX客户端框架提供了工具函数以减轻复杂度。DomElement的addCssClass 和removeCssClass正是我们需要的。假设span的ID为answerResult，这就是为正确回答动态添加CSS的全部：
Sys.UI.DomElement.addCssClass($get('answerResult'), 'correct');
我经常在产品中通过创建名字与某个域相关状态相同的CSS类来使用这种技术。于是，当显示数据时，只需简单的使用addCssClass添加一些上下文样式即可。
决定一个元素的大小
如果你从事客户端UI设计一段时间以后，你一定会遇到这种情况，如何在运行时决定HTML元素的大小？如果你需要兼容各种浏览器，那么你会发现这很枯燥。不是忍受痛苦，相反你可以使用DomElement的getBounds方法。它返回一个带有元素大小和位置的关联数组。
例如，如果你已经用一些数据填充了GridView，突然你想看看它的高度，如何才能做到？
varUI.DomElement.getBounds($get('GridView1')).height;
定位和移动元素
我想介绍的最后一个方法是getLocation 和setLocation。毕竟，找到元素的大小之后，下一步你可能想它在哪里，或者想移动它。
例如，如果你想将一个div，SomeDiv，向右移动75px：
varUI.DomElement.getLocation($get('SomeDiv'));
Sys.UI.DomElement.setLocation($get('SomeDiv'), loc.x + 75, loc.y);
把它放到一个循环中，你就得到了一个小的动画：
for(i = 1; i <= 75; i++)
{
Sys.UI.DomElement.setLocation($get('SomeDiv'), loc.x + i, loc.y);
}
结论
你可能不像使用$addHandler和base type extensions那样频繁使用它们。然而，当你需要它们时，如果你知道它们你将会非常高兴。
