Ajax不重新加载整个网页的情况下,对网页的某部分进行更新实例
来源:互联网 发布:手柄 知乎 编辑:程序博客网 时间:2024/05/18 12:42
AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
小编是个初学者,这里送给初学者一个实例,希望我们这些编码爱好者都可以在这条路上越走越远
<div id="box"></div><button id="btn">更新</button>
#box{width: 100px;height: 100px;background-color: #ccc;}
var boxobg=document.getElementById('box');var btnobg=document.getElementById('btn');btnobg.onclick=function(){// 声明xml对象var xml=new XMLHttpRequest();// 准备好发送的内容xml.open("GET","text.txt",true);// 发送xml.send();// 监听数据变化xml.onreadystatechange=function(){if(xml.readyState==4 && xml.status==200){boxobg.innerHTML=xml.responseText;}}}
其中text.txt是你的本地文件
然后在浏览器的地址栏输入
加载结果如下图所示
当你点击按钮更新后文字便会被加载进来,显示在box 中
如果要更改内容不用重新加载页面,只需点击更新即可,这就是ajax的好处
如有错误还望大神指出,希望对初学者有帮助。
阅读全文
0 0
- Ajax不重新加载整个网页的情况下,对网页的某部分进行更新实例
- 网页打印(不使用插件的情况下)
- 如何对ajax型的网页数据进行抓取
- Ajax上传网页的实例
- 如何对网页的加载进行性能优化
- 如何对网页的加载进行性能优化
- 如何对 网页的加载 进行 性能优化
- 如何对网页的加载进行性能优化
- html/jsp针对网页history.back()之后ios系统不重新加载js的解决办法
- 采集ajax加载生成的网页
- 在ubuntu下php网页输出乱码,在不涉及数据库编码的情况下:
- 掌握 Ajax,第 6 部分: 建立基于 DOM 的 Web 应用程序 在不刷新页面的情况下使用 DOM 改变网页界面
- C#对指定的网页进行截图
- C#对指定的网页进行截图
- 网页的分帧
- 从输入URL到整个网页加载完毕及显示在屏幕上的整个流程
- iOS 手机没有安装支付宝的情况下,不调支付宝网页的解决办法
- iOS 手机没有安装支付宝的情况下,不调支付宝网页的解决办法
- CentOS修改mysql 用户root的密码并允许远程登录
- HISTTIMEFORMAT
- caffe-损失层-SoftmaxWithLossLayer 和SoftmaxLayer
- Ubuntu16.4环境初始化
- 使用swiper 出现闪屏问题
- Ajax不重新加载整个网页的情况下,对网页的某部分进行更新实例
- input标签file类型,选择多个文件进行上传
- Spring--hibernate整合_事务管理
- linux——CentOS真机安装过程中遇到的问题
- 直方图均衡(Opencv,十行代码)
- django1.11.5版本中后台字段类型提示错误解决方法,个人资料分表方法用一对一关联
- Redis的应用场景
- 字符串函数的模拟实现
- Nginx反向代理的配置