首页Web:使用ajax实现页面部分更新,写出完整的html代码

Web:使用ajax实现页面部分更新,写出完整的html代码

时间: 2024-02-25 19:54:33 浏览: 123

ajax实现了一个页面数据的局部刷新

5星 · 资源好评率100%

本文档利用ajax实现了一个页面数据的局部刷新。

好的，以下是一个使用 Ajax 实现页面部分更新的完整 HTML 代码示例： ```html <!DOCTYPE html> <html> <head> <title>Ajax Demo</title> <script> function updateContent() { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("content").innerHTML = this.responseText; } }; xmlhttp.open("GET", "data.php", true); xmlhttp.send(); } </script> </head> <body> <h1>Ajax Demo</h1> <p>点击下面的按钮，使用 Ajax 获取数据并更新页面</p> <button onclick="updateContent()">更新内容</button> <div id="content"> <p>这里是初始内容</p> </div> </body> </html> ``` 上面的代码中，当点击 "更新内容" 按钮时，会使用 Ajax 发送 GET 请求到 "data.php" URL，获取数据并更新页面中 id 为 "content" 的元素。在实际应用中，需要根据具体需求修改 URL 和数据处理方式。

阅读全文