动态页面更新是通过XML HTTP(也称为Ajax)实现的一种技术。XML HTTP允许在不刷新整个页面的情况下与服务器通信,以更新页面的特定部分。
下面是一个使用XML HTTP动态更新页面的示例:
1. 创建XML HTTP对象:
```javascript
var xhr = new XMLHttpRequest();
```
2. 定义回调函数来处理服务器响应:
```javascript
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 处理服务器响应
var response = xhr.responseText;
// 更新页面的特定部分
document.getElementById("content").innerHTML = response;
}
};
```
3. 发送XML HTTP请求:
```javascript
xhr.open("GET", "update.php", true);
xhr.send();
```
在这个示例中,我们使用XML HTTP对象发送一个GET请求到服务器的`update.php`页面。当服务器响应成功返回并且状态码为200时,回调函数会被触发。在回调函数中,我们可以处理服务器的响应,并将其更新到页面的特定部分(例如,具有id为`content`的元素)。
注意:在实际应用中,您可能还需要添加错误处理和其他逻辑来优化用户体验。此外,您可以使用XML HTTP对象发送POST请求以传递数据给服务器,并在回调函数中处理返回的数据。