But,You still need to care javascript's FUNCTION SCOPE.Also see code snippet:
var scope = "global";

function f( ) {alert(scope); // Displays "undefined", not "global"var scope = "local"; // Variable initialized here, but defined everywherealert(scope); // Displays "local"}f( );
Right,thought you alert(scope) first and then define a new functin scope variable scope.However,once you define a function scope vriable,it will hide the global variable in the function body,whatever the definition order.

AutoAssist is an auto completion web widget that written in pure JavaScript. It can help enhance the accessibility of existing website, let the users to work effective and feel comfortable. AutoAssist Javascript only and is built upon prototype and rico. Its main features are :

* improve the User Experience
* Don't require an Ajax experience
* pretty managed JavaScript, easy to understand and customize
* works well on Mozilla/FireFox, IE and Opera
* have a nice solution for fast user typing, reduce a lot of corresponding server loading (20% - 80% *)

The code for the screenshot is very simple :

var foo = function() {
    var tt = new AutoAssist("t", {setRequestOptions: function() {
            var pars = "name=" + this.txtBox.value;
            return { url: "/country.php", parameters: pars };
        }});
}
Event.observe(window, "load", foo);

You can find a ten minutes tutorial for AutoAssist explaining in details how to use this script to create an auto-complete list based on country data.

By the way,script.aculo.us also has it's impelmention:http://demo.script.aculo.us/ajax/autocompleter

目前比较公认的有三种数据传输交互方式：XHTML Fragment,JSON,XML。当然也有不同的声音，这里也会介绍。

这种方式也被称为AHAH, 目前很多遗留系统想沾AJAX的光改善一下交互，节省一下带宽，大多数采用了此种方式。我们以 Struts为例子，比如在页面上有一个按钮，点击后得到现在我收藏的图书列表，则此图书列表(Table元素组成)便可以以XHTML片断的形式返回客户端，然后利用XHR对象的responseText属性得到，设知道某DIV中。

for (Iterator it = sortedPresidentsList.iterator(); it.hasNext();) {
HashMap hm = (HashMap)it.next();
html += "<tr>";
html += "<td>" + (String)hm.get("firstName") + "</td>";
html += "<td>" + (String)hm.get("middleName") + "</td>";
html += "<td>" + (String)hm.get("lastName") + "</td>";
html += "<td>" + (String)hm.get("firstYearInOffice") + "</td>";
html += "<td>" + (String)hm.get("lastYearInOffice") + "</td>";
html += "</tr>";
}
html += "</table>";

// Write the HTML to response
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println(html);
out.flush();

这是一个Struts的例子，Action中response直接flush输出。当然也可以让Struts导向到结果jsp页面，请求的XHR可以得到jsp生成的HTML内容。
缺点是：当返回有Form的内容的时候会崩溃。CSS样式设置复杂。

• XML

XML在很多AJAX示例当中作为数据传递的标准。而XML具有很好的数据语义描述性，服务器端生成方式众多，而几乎所有浏览器都支持对XML 的解析。以JavaScript解析服务器端返回的XML为例子，只需要XHR的responseXML属性即可获得XML由javascript解析 (请看我在BlogJAVA写的操作示例) 而XML的产生方式似乎所有人都认准了

<channel>

<title>Dan's Data</title>
<description>New and interesting computer hardware, gadgets and toys reviewed. And letters. Lots of letters.</description>
<link>http://www.dansdata.com/</link>

<item>
<title>Ultrasone HFI-650 headphones</title>
<description>They look like the 550s, they feel like the 550s, they've got marketing buzzwords like the 550s - are they worth the extra money?</description>
<link>http://www.dansdata.com/quickshot025.htm</link>
</item>..

一类，似乎这样子语义描述更清楚。但是我从michael那里得到启示，确实，用此类方式传输数据几乎无法在客户端统一处理。从我的showcase中大家也可以看到，Javascript解析XML后更新DOM简直就是体力活，枯燥且容易出错，而此种XML返回的数据则会千差万别，以寻找特定tag的节点的方式怎么能统一处理呢？于是，第二种XML传输方式应运而生。

<list>
<type>java.util.List</type>
<map>
<type>yourapp.domain.Book</type>
<string>title</string>
<string>JavaScript, the Definitive Guide</string>
<string>publisher</string>
<string>O'Reilly</string>
<string>author</string>
<string>David Flanagan</string>
<string>cover</string>
<string>/images/cover_defguide.jpg</string>
<string>blurb</string>
<string>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</string>
</map>
<map>
<type>yourapp.domain.Book</type>
<string>title</string>
<string>DOM Scripting</string>
<string>publisher</string>
<string>Friends of Ed</string>
<string>author</string>
<string>Jeremy Keith</string>
<string>cover</string>
<string>/images/cover_domscripting.jpg</string>
<string>blurb</string>
<string>Praesent et diam a ligula facilisis venenatis.</string>
</map>
</list>

这样子只要客户端和服务器端达成共识string long int等代表的数据类型就可以在两端还原成自己可用的对象。而这也是micheal认为真正的AJAX应该有的形态，其中AJAX引擎便承担起了这份工作。
缺点：XML的构造和解析在没有类库辅助的情形下是一个灾难，而XML文件的传输效率似乎也不如简单的文本高。我讲会在后面的blog中提及XML文件的产生方法，以及客户端一些解析的框架。

• JSON

JSON是JavaScript Object Notation的缩写，是一份规范，定义了极其简单的数据描述形式。几乎在所有主流语言上都有实现。JSON对象是名/值对的集合，所以一个简单的JSON对象为：
var testObj={
"name" : david,
"sex" : Male,
"work" : SE
}
客户端javascript调用eval()就可以解析由服务器端产生的JSON串。var jsonExpression =
( + req.responseText + );
var customer = eval(jsonExpression);
而服务器端(JAVA)也有相应的lib来操作：JSONObject 的toString()
缺点：虽然JSON简洁高效，但是转化为Javascript对象通过eval()也就是说，AJAX的传输邦定在了JSON上面，这样，总会让人不很放心。并且JSON对象难于阅读与理解，不如XML直观。

除了会在下一篇AJAX的blog介绍JAVA对象序列化到XML以外，会一些从头开始构建应用的例子，其中不会使用buffalo DWR一类的框架，我会尝试选用不同的方案作为数据传输方式供大家参考。

这是Flickr上面一段代码。确实，它使得代码阅读起来结构不清晰了。Behavior应用之后，不需在元素上写明触发事件要执行的方法，比如
<a onclick="this.parentNode.removeChild(this)" href="#">
Click me to delete me
</a>
而变成了
<ul id="example">
<li>
<a href="/someurl">Click me to delete me</a>
</li>
</ul>
那么javascript如果找到这个a链接并加上onclick事件方法的呢？采用css selector

var myrules = {  
'#example li' : function(el){  
el.onclick = function(){   
this.parentNode.removeChild(this);  
} }};
Behaviour.register(myrules); 确实看起来，html清爽了，但是，却引入了其他的元素。ok，我们可以为每个控件定义id，其实也未尝不可，asp.net不也是web component开发的时候都定义id的么？可似乎又脱裤子放屁之嫌。在维护一个对某一组应用相同样式或响应
相同方法的html控件上应用behavior，有意义，起码不必每个上面都写上onclick之类的，但是对于更普遍的应用，每个html控件要做得事情是不同的啊。那个时候，不但用behavior代码量增加了，而且维护一个var myrules里的内容和去删除控件上的onclick其实工作量差不多。真正的应用可不是demo啊，列出来一排link写着remove me，然后执行一样的动作。
不过正如我上面说的，还是有一定的应用场景的，大家可以在有此需求的时候考虑，还有一Behaviour.js