Ajax 实例

news2024/11/26 3:57:06

文章目录

  • AJAX 实例
    • AJAX 实例解析


AJAX 实例

在这里插入图片描述

为了帮助您理解 AJAX 的工作原理,我们创建了一个小型的 AJAX 应用程序:

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function loadXMLDoc()
{
	var xmlhttp;
	if (window.XMLHttpRequest)
	{
		//  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
		xmlhttp=new XMLHttpRequest();
	}
	else
	{
		// IE6, IE5 浏览器执行代码
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.onreadystatechange=function()
	{
		if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
			document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
		}
	}
	xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);
	xmlhttp.send();
}
</script>
</head>
<body>
<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>
</body>
</html>

在这里插入图片描述

AJAX 实例解析

上面的 AJAX 应用程序包含一个 div 和一个按钮。

div 部分用于显示来自服务器的信息。当按钮被点击时,它负责调用名为 loadXMLDoc() 的函数:

<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>

接下来,在页面的 head 部分添加一个

<head>
  <script>
    function loadXMLDoc()
   {
       ....AJAX脚本执行...
    }
  </script>
</head>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/460908.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

第五期(2022-2023)传统行业云原生技术落地调研报告——金融篇

随着数字化浪潮的来临&#xff0c;云原生技术正在改变着各行各业&#xff0c;通过IT变革驱动业务创新发展&#xff0c;促进企业自身以及产业生态的转型升级。 因此&#xff0c;灵雀云联合云原生技术实践联盟&#xff08;CNBPA&#xff09;和行业内头部厂商F5&#xff0c;共同发…

如何实现一款接入chatGPT的智能音箱

现有的一些“智能音箱”如某度和某猫精灵&#xff0c;跟现在的chatGPT比显得智障。如果能有一款接入chatGPT的智能音箱&#xff0c;它的交互性就好多啦。有gpt加持的智能音箱绝对会很强&#xff0c;以下提供探讨下实现思路。 目前智能音箱在语音交互层面依然不够成熟&#xff0…

PSO算法、MATLAB代码实现以及测试效果

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 PSO算法原理进化操作算法流程图matlab代码实现main函数部分适应度函数部分PSO算法主体测试结果 (F1~F6) PSO算法原理 粒子群优化( Particle Swarm Optimization&am…

【C++关联容器】map的成员函数

目录 map 1. 构造、析构和赋值运算符重载 1.1 构造函数 1.2 析构函数 1.3 赋值运算符重载 2. 迭代器 3. 容量 4. 元素访问 5. 修改器 6. 观察者 7. 操作 8. 分配器 map map是关联容器&#xff0c;它按照特定的顺序存储由关键字值和映射值的组合形成的元素。 在一…

【Java】再看排序 —— 关于 Comparator 的用法

谈一个比较基础&#xff0c;又很常用的东西&#xff0c; Comparator 类&#xff0c;之前我写过一篇浅浅的关于这个的文章 &#xff0c;今天再复盘一下这个问题&#xff0c;把它弄熟 ps: 本文中提供的代码&#xff0c;为了提高可读性都没用 lamdam 和 函数式编程 简化书写&…

JVM-0423

运行时内存 程序计数器 作用:记录每个线程的代码执行到哪一条指令了 为了保证程序(在操作系统中理解为进程)能够连续地执行下去&#xff0c;CPU必须具有某些手段来确定下一条指令的地址。而程序计数器正是起到这种作用&#xff0c;所以通常又称为指令计数器。在程序开始执行…

论文阅读:Swin Transformer: Hierarchical Vision Transformer using Shifted Windows

使用移位窗口的分层视觉Transformer 继续阅读Transformer相关 0、摘要 本文提出了一种新的视觉Transformer&#xff0c;称为Swin Transformer&#xff0c;能够作为一个通用的骨干计算机视觉。将Transformer从语言适应到视觉的挑战来自于两个领域之间的差异&#xff0c;例如视…

QGIS数据可视化学习笔记01——一般的图层样式调整和在地图上添加图表

说明&#xff1a;QGIS数据可视化章节用的数据为QGIS绘制一张地图学习章节的数据&#xff0c;传送门&#xff1a;https://blog.csdn.net/qq_47188967/article/details/130196284 一、 一般的图层样式调整 首先呢&#xff0c;在QGIS中打开上一章节用的数据&#xff0c;界面如下&…

SpringMVC-HttpMessageConverter的使用

目录 1、HttpMessageConverter概述 2、RequestBody 3、RequestEntity 4、ResponseBody 5、SpringMVC处理json 6、SpringMVC处理ajax 7、RestController注解 8、ResponseEntity 1、HttpMessageConverter概述 HttpMessageConverter是什么 HttpMessageConverter&#xff0…

rabbitmq的高级特性

1.消息可靠性问题&#xff08;实现消费者确认&#xff09; 1.在项目中添加配置 logging:pattern:dateformat: HH:mm:ss:SSSlevel:cn.itcast: debug spring:rabbitmq:host: 192.168.2.182 # rabbitMQ的ip地址port: 5672 # 端口username: rootpassword: rootvirtual-host: /publ…

1.Qt Creator简介及Hello World

安装 下载链接 Qt 5.14.2下载 SDK建议的安装路径 SDK的案例中&#xff0c;宏定义默认要求直接安装在C盘 查看建议路径的流程 右键“解决方案”下的项目名称&#xff0c;选择最下面的“属性” “C/C” -> “常规” -> “附加包含目录” -> “右侧小箭头” ->…

【软件测试】3年测试岗碌碌无为?我到底该咋办?测试提升成长之路...

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 无论哪个岗位&…

线程同步方式之三信号量

Linux线程同步方法之三 信号量 信号量本质上是一个计数器&#xff0c;用来表示公共资源中资源的数量。只要拥有信号量&#xff0c;未来一定能够拥有临界资源的一部分使用权。故申请信号量的本质就是对临界资源中特定的小块资源的预订机制。故能通过访问信号量就能提前知道临界…

Redis可视化工具-Another Redis Desktop Manager 安装与连接哨兵集群

目录 一、下载安装 1.1 下载 1.2 安装 二、使用 2.1 新建连接 2.2 新增数据 2.3 应用设置 2.3.1深色模式、语言 2.3.2多个连接的颜色标记 一、下载安装 Another Redis DeskTop Manager 是 Redis 可视化管理工具&#xff0c;体积小&#xff0c;完全免费。最重要的是稳定…

智慧物联网边缘协同感知(EICS)技术方案: 低功耗无线扫描唤醒技术

物联网的传感器或控制节点通常有体积限制&#xff0c;只能使用钮扣电池、小型电池&#xff0c;甚至使用能量收集源进行运作。在许多工业应用中&#xff0c;需要人工更换电池的成本&#xff0c;特别是在难以接近地方更换所需的成本&#xff0c;使得人们更加重视降低平均电流消耗…

缓存一致问题、幂等、jvm调优

缓存笔记 来自 程序员囧辉 黑马博学谷 幂等问题 1 缓存一致问题 1.1.同步删除 核心流程&#xff1a; 更新数据库数据删除缓存数据 问题&#xff1a; . 并发场景下存在脏数据 (并发有脏数据问题). 难以收拢所有更新数据库入口 (可能通过命令行、工具等删除db&#xff0c;…

[Golang] 设计模式以及单例设计模式实例实现

&#x1f61a;一个不甘平凡的普通人&#xff0c;致力于为Golang社区和算法学习做出贡献&#xff0c;期待您的关注和认可&#xff0c;陪您一起学习打卡&#xff01;&#xff01;&#xff01;&#x1f618;&#x1f618;&#x1f618; &#x1f917;专栏&#xff1a;算法学习 &am…

Django框架之视图的基本使用

Django框架之视图的基本使用 概述 在django中&#xff0c;视图方法简称视图&#xff0c;对web请求进行回应。 视图就是一个python函数&#xff0c;在views.py文件中定义。 定义视图 在project/myapp/views.py文件中定义 引入http from django.http import HttpResponse 视…

【C语言】实战练习

目录 1.计算体积&#xff1a; 2、根据父母身高计算孩子的理论身高&#xff1a; 3、三十六计的几计&#xff1a; 4、文本输出&#xff1a; 5、粮仓计数&#xff1a;​编辑 6、auto 7、static: 8、模拟用户注册系统&#xff1a; 1.计算体积&#xff1a; #include <std…

NetXpert XG2帮您解决“布线安装与维护”难题

在传输大量数据时&#xff0c;光纤变得越来越重要&#xff0c;而铜缆在未来也将继续发挥重要作用&#xff0c;因此我们不仅要比较两种类型布线的优缺点&#xff0c;还要探究光纤传输中的错误来源。 测试光缆传输损耗的准确性对于故障排除至关重要&#xff0c;特别是在光纤情况下…