当我们访问一个网站的时候，有时候会遇到一些需要加载数据的情况。传统的网页加载是通过刷新整个页面来获取新的数据，但这种方式会导致用户体验较差，因为页面需要重新加载。为了改善这种情况，Ajax技术应运而生。Ajax可以在不刷新整个页面的情况下加载新的数据，这样用户可以持续地浏览页面而无需等待长时间的加载。
举个例子来说明，假设我们有一个电影网站，用户进入网站后需要加载最新的电影列表。传统的方式是用户进入网站后，整个页面都需要刷新，包括导航栏、底部信息等等，用户体验会受到很大的影响。而使用Ajax技术，我们可以只刷新电影列表部分，从而提高用户的体验。用户进入网站后，页面会立即展示出最新的电影列表，无需等待整个页面刷新。
// 传统方式，页面需要整体刷新<html><head><title>电影网站</title></head><body><div id="header">导航栏</div><div id="content"><h1>最新电影</h1><ul><li>电影1</li><li>电影2</li><li>电影3</li>...</ul></div><div id="footer">底部信息</div></body></html>
// 使用Ajax方式，只刷新电影列表部分// index.html<html><head><title>电影网站</title><script src="/post/ajax.js"></script></head><body><div id="header">导航栏</div><div id="content"><h1>最新电影</h1><ul id="movieList"><!-- 这里是电影列表 --></ul></div><div id="footer">底部信息</div><script>// 使用Ajax技术，获取最新的电影列表ajax.get("movieList.php", function(response) {document.getElementById("movieList").innerHTML = response;});</script></body></html>上述的例子中，我们使用Ajax技术实现了一打开就加载最新电影列表的功能。当用户进入网站后，页面会立即展示最新的电影列表。而实现的方法是通过调用异步请求函数ajax.get来获取最新的电影列表，并将返回的结果赋值给id为movieList的元素的innerHTML属性，从而更新电影列表。这样在不刷新整个页面的情况下，用户就能够看到最新的电影列表。
除了电影网站，还有很多其他的网站也可以使用Ajax技术一打开就加载。比如一个新闻网站，一打开就加载最新的新闻列表；一个社交网站，一打开就加载用户的好友列表。通过使用Ajax技术，我们可以将这些需要加载的数据以一种更高效、无刷新的方式展示给用户，从而提高用户的体验。