当前位置: 首页 > news >正文

第 1 章:原生 AJAX

原生AJAX

1. AJAX 简介

  • AJAX 全称为 Asynchronous JavaScript And XML,就是异步的 JS 和 XML。
  • 通过 AJAX 可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。
  • AJAX 不是新的编程语言,而是一种将现有的标准组合在一起使用的新方式。

2. XML 简介

  • XML (Extensible Markup Language)可扩展标记语言。

  • XML 被设计用来传输和存储数据。

  • XML 和 HTML 类似,不同的是 HTML 中都是预定义标签,而 XML 中没有预定义标签,全都是自定义标签,用来表示一些数据。

  • 比如说我有一个学生数据:name = “孙悟空” ; age = 18 ; gender = “男” ;
    用 XML 表示:

<student><name>孙悟空</name><age>18</age><gender></gender>
</student>
  • 现在已经被 JSON 取代了。
    用 JSON 表示:
    {"name":"孙悟空","age":18,"gender":"男"}

3. AJAX 的特点

3.1 AJAX 的优点

  1. 可以无需刷新页面而与服务器端进行通信。
  2. 允许你根据用户事件来更新部分页面内容。

3.2 AJAX 的缺点

  1. 没有浏览历史,不能回退
  2. 存在跨域问题(同源)
  3. SEO 不友好

4. HTTP

HTTP(hypertext transport protocol)协议【超文本传输协议】,协议详细规定了浏览器和万维网服务器之间互相通信的规则。

4.1 请求报文

在这里插入图片描述

4.2 响应报文

在这里插入图片描述

4.3 Chrome网络控制台产看通信报文

网页F12打开控制台 -> Network -> Headers
在这里插入图片描述

5. NodeJS的安装与介绍

Node.js基础

6. express框架介绍与基本使用

因为ajax要向服务端发送请求,所以我们这里用express模拟一下服务端

6.1 express的安装

  1. 初始化npm包管理工具:npm init --yes
  2. 安装express:npm i express

6.2 使用express

// 1. 引入express
const express = require('express');// 2. 创建应用对象
const app = express();// 3. 创建路由规则
app.get('/', (request, response) => {response.send('hello express');
}// 4. 监听端口启动服务
app.listen(8000, () => {console.log("服务已经启动,8000端口监听中……);
}

6.3 启动服务

右键js文件打开终端输入:node 文件名.js
在这里插入图片描述

相关文章:

第 1 章:原生 AJAX

原生AJAX 1. AJAX 简介 AJAX 全称为 Asynchronous JavaScript And XML&#xff0c;就是异步的 JS 和 XML。通过 AJAX 可以在浏览器中向服务器发送异步请求&#xff0c;最大的优势&#xff1a;无刷新获取数据。AJAX 不是新的编程语言&#xff0c;而是一种将现有的标准组合在一…...

【代码随想录|贪心part04以后——重叠区间】

代代码随想录|贪心part04以后——重叠区间 一、part041、452.用最少数量的箭引爆气球2、435. 无重叠区间2、763.划分字母区间3、56. 合并区间4、738.单调递增的数字总结python 一、part04 1、452.用最少数量的箭引爆气球 452. 用最少数量的箭引爆气球 class Solution:def f…...

Denodo 连续 4 年获评 Gartner® 数据集成工具魔力象限™ 领导者

Gartner 在其 2023 年数据集成工具魔力象限中连续第四年将 Denodo 评为“领导者”。 Gartner 表示&#xff1a;“由于对数据编织架构、数据产品交付以及支持生成式 AI 的集成数据的需求即将到来&#xff0c;数据集成工具市场正在蓬勃发展。数据和分析领导者应该利用这项研究来…...

WHAT - React 函数与 useMemo vs useCallback

目录 一、介绍useMemo 与 useCallback 的区别示例代码useMemo 示例useCallback 示例 总结 二、当一个函数被作为依赖项useMemo 和 useCallback 的适用情况选择使用 useCallback 或 useMemo总结实际例子 一、介绍 在 React 中&#xff0c;useMemo 和 useCallback 是两个用于性能…...

系统分析师7:数学与经济管理

文章目录 1 图论应用1.1 最小生成树1.2 最短路径1.3 网络与最大流量 2 运筹方法2.1 线性规划2.2 动态规划2.2.1 供需平衡问题2.2.2 任务指派问题 3 预测与决策3.1 不确定型决策分析3.2 风险型决策3.2.1 决策树3.2.2 决策表 4 随机函数5 数学建模 1 图论应用 ①最小生成树 连接…...

一套简约的qt 蓝色qss方案

一套简约的qt 蓝色qss方案 直接使用qss代码 QMenu {background: qlineargradient(x1:0, y1:0, x2:0, y2:1,stop:0 rgba(255, 255, 255, 240),stop:0.2 rgba(255, 255, 255, 200),stop:0.6 rgba(255, 255, 255, 160),stop:1 rgba(255, 255, 255, 120));qproperty-effect: blur…...

OCSP原理及实践

1.OCSP介绍 在PKI体系中&#xff0c;CA机构颁发合法的证书。使用者可以使用CA根证书验证该证书是否被篡改过&#xff0c;但无法从证书文件验证出证书是否被吊销。因此CA机构会通过发布CRL&#xff08;Certificate Revocation List&#xff09;来告知所有人&#xff0c;哪些证书…...

前端流程图框架

1、Mermaid&#xff1a; Mermaid 是一个用于绘制流程图、时序图、甘特图等的纯 JavaScript 库。它使用简单的文本语法来定义图表结构&#xff0c;支持多种类型的流程图&#xff0c;易于集成到网页中。 2、Draw.io&#xff1a; Draw.io 是一个在线的流程图绘制工具&#xff0…...

13.6 编写go代码接收webhook的告警发送钉钉

本节重点介绍 : 使用钉钉机器人发送到钉钉群通过alertmanager webhook发送我们自定义的go程序中解析alert对象并拼接钉钉信息发送 需求分析 使用钉钉机器人发送到钉钉群 钉钉机器人发送群消息 文档地址 通过webhook发送我们自定义的go程序中 然后解析发过来的alert&#x…...

codetest

1、寻找身高相近的小朋友 #include <iostream> #include <bits/stdc.h>using namespace std;//寻找身高相近的小朋友//输入&#xff0c;第一行两个整数&#xff0c;分别是小明身高&#xff0c;其他小伙伴个数&#xff0c;第二行是其他小伙伴的身高 //100 10 //95 …...

MyBatis-Plus拦截器接口InnerInterceptor失效?因MyBatis缓存机制而踩的一个深坑

InnerInterceptor 接口是 MyBatis-Plus 提供的一个拦截器接口&#xff0c;用于实现一些常用的 SQL 处理逻辑。例如某个组件运作在多系统的平台上&#xff0c;不同系统需要隔离&#xff0c;于是可以通过这个拦截器接口&#xff0c;给每一条要执行的sql末尾拼接一个AND systemId …...

jmeter之计数器

计数器作用&#xff1a; 对于自增长的数字&#xff0c;可以使用计数器实现 一、添加计数器及参数说明 添加计数器 计数器参数说明 Starting value&#xff1a;给定计数器的起始值、初始值&#xff0c;第一次迭代时&#xff0c;会把该值赋给计数器 递增&#xff1a;每次迭代…...

协议集合(学习笔记)

按照数据的传送方式&#xff0c;通信协议可分为以下2种。 串行通信&#xff1a;串行&#xff08;Serial&#xff09;指的是逐个传输数据位&#xff0c;一次只传输一个位。 并行通信&#xff1a;并行&#xff08;Parallel&#xff09;指的是同时传输多个数据位&#xff0c;一次…...

进程

进程 进程进程的含义PCB块内存空间进程分类&#xff1a;进程的作用进程的状态进程已经准备好执行&#xff0c;所有的资源都已分配&#xff0c;只等待CPU时间进程的调度 进程相关命6.查询进程相关命令1.ps aux2.top3.kill和killall发送一个信号 函数1.fork();2.getpid3.getppid示…...

10款好用的电脑监控软件推荐丨2024年干货整理,赶紧码住!

选择合适的电脑监控软件可以帮助企业和个人更好地管理和保护其计算机资源。以下是10款较为好用的电脑监控软件推荐。 1. 安企神 7天试用体验https://work.weixin.qq.com/ca/cawcde06a33907e60a 简介&#xff1a;安企神是一款专为企业设计的信息安全管理软件&#xff0c;提供…...

【MySQL-24】万字全面解析<索引>——【介绍&语法&性能分析&使用规则】

前言 大家好吖&#xff0c;欢迎来到 YY 滴MySQL系列 &#xff0c;热烈欢迎&#xff01; 本章主要内容面向接触过C的老铁 主要内容含&#xff1a; 欢迎订阅 YY滴C专栏&#xff01;更多干货持续更新&#xff01;以下是传送门&#xff01; YY的《C》专栏YY的《C11》专栏YY的《Lin…...

刷题记录(2)

1. HWOD机试 - 模拟消息队列(100) package com.yue.test;import org.junit.Test;import java.util.ArrayList; import java.util.Arrays; import java.util.LinkedList; import java.util.List;/*** Author: 夜雨* Date: 2021-12-08-10:31* Description:* Version 1.0*/ public…...

JVM中的GC过程

堆内存结构&#xff1a;在详细讨论GC过程之前&#xff0c;需要了解JVM堆内存的结构。JVM堆内存通常被分为新生代&#xff08;Young Generation&#xff09;和老年代&#xff08;Old Generation&#xff09;&#xff0c;其中新生代又进一步细分为Eden区&#xff08;Eden Space&a…...

Python实战项目:天气数据爬取+数据可视化(完整代码)_python爬虫实战

一、选题的背景 随着人们对天气的关注逐渐增加&#xff0c;天气预报数据的获取与可视化成为了当今的热门话题&#xff0c;天气预报我们每天都会关注&#xff0c;天气情况会影响到我们日常的增减衣物、出行安排等。每天的气温、相对湿度、降水量以及风向风速是关注的焦点。通过…...

FFmpeg源码:compute_frame_duration函数分析

一、compute_frame_duration函数的定义 compute_frame_duration函数定义在FFmpeg源码&#xff08;本文演示用的FFmpeg源码版本为7.0.1&#xff09;的源文件libavformat/demux.c中&#xff1a; /*** Return the frame duration in seconds. Return 0 if not available.*/ stat…...

IceC:面向嵌入式平台的轻量级ICE兼容中间件

1. IceC&#xff1a;面向资源受限嵌入式平台的轻量级ZeroC ICE兼容中间件 1.1 设计定位与工程必要性 IceC并非ZeroC ICE的全功能移植&#xff0c;而是在AVR&#xff08;如ATmega328P&#xff09;和ESP8266等典型资源受限平台约束下&#xff0c;对ICE通信模型进行深度裁剪与重构…...

高效掌控窗口尺寸:WindowResizer的完整使用指南

高效掌控窗口尺寸&#xff1a;WindowResizer的完整使用指南 【免费下载链接】WindowResizer 一个可以强制调整应用程序窗口大小的工具 项目地址: https://gitcode.com/gh_mirrors/wi/WindowResizer 你是否曾经遇到过这些令人烦恼的场景&#xff1f;一个老旧软件的窗口太…...

项目性能优化实践:深入FMP算法原理探索

在技术领域&#xff0c;我们常常被那些闪耀的、可见的成果所吸引。今天&#xff0c;这个焦点无疑是大语言模型技术。它们的流畅对话、惊人的创造力&#xff0c;让我们得以一窥未来的轮廓。然而&#xff0c;作为在企业一线构建、部署和维护复杂系统的实践者&#xff0c;我们深知…...

别再手写MCP适配层了!2024最新Python企业模板已内置SPI扩展点、链路追踪埋点与熔断降级策略

第一章&#xff1a;MCP服务器开发模板的演进与企业级定位 MCP&#xff08;Model-Controller-Protocol&#xff09;服务器开发模板并非静态规范&#xff0c;而是随云原生架构、服务网格与可观测性实践的深化持续演进的技术基座。早期版本聚焦于HTTP路由与基础中间件封装&#xf…...

从零到精通:MySQL多平台安装全攻略

1. MySQL安装前的准备工作 第一次接触MySQL安装的朋友可能会被各种术语吓到&#xff0c;但其实只要掌握几个核心概念&#xff0c;后面的操作就会顺利很多。我刚开始接触数据库时也走过不少弯路&#xff0c;今天就把这些经验总结成小白也能看懂的操作指南。 MySQL本质上就是一个…...

3分钟搞定Axure RP中文界面:告别英文困扰,专注原型设计

3分钟搞定Axure RP中文界面&#xff1a;告别英文困扰&#xff0c;专注原型设计 【免费下载链接】axure-cn Chinese language file for Axure RP. Axure RP 简体中文语言包。支持 Axure 11、10、9。不定期更新。 项目地址: https://gitcode.com/gh_mirrors/ax/axure-cn 还…...

保姆级避坑指南:用Anaconda和Xinference在Windows上部署LangChain-Chatchat(附解决httpx报错)

Windows系统下LangChain-Chatchat本地化部署全流程避坑手册 最近在帮几个朋友部署LangChain-Chatchat时&#xff0c;发现即便是按照官方文档操作&#xff0c;Windows环境下依然会遇到各种"坑"。特别是当Anaconda、Xinference和LangChain-Chatchat这几个组件混在一起…...

XUnity.AutoTranslator:Unity游戏智能翻译插件的完整实战指南

XUnity.AutoTranslator&#xff1a;Unity游戏智能翻译插件的完整实战指南 【免费下载链接】XUnity.AutoTranslator 项目地址: https://gitcode.com/gh_mirrors/xu/XUnity.AutoTranslator XUnity.AutoTranslator是一款专为Unity游戏设计的智能翻译插件&#xff0c;能够实…...

告别排版地狱:PaperXie AI,10 分钟让你的毕业论文合规 “零返工”

paperxie-免费查重复率aigc检测/开题报告/毕业论文/智能排版/文献综述/AIPPThttps://www.paperxie.cn/format/typesettinghttps://www.paperxie.cn/format/typesetting 引言&#xff1a;被格式细节毁掉的毕业努力 当你熬了无数个夜晚&#xff0c;反复打磨论文的每一个论点&…...

告别卡顿!用华为云ECS搭建高性能eNSP Pro服务器,支持大规模组网实验

华为云ECS深度优化指南&#xff1a;解锁eNSP Pro大规模组网实验的终极性能 当你在本地PC上运行eNSP Pro进行网络实验时&#xff0c;是否遇到过这样的困境&#xff1a;模拟5台设备就开始卡顿&#xff0c;复杂拓扑直接崩溃&#xff0c;或者保存配置时进度条像蜗牛爬行&#xff1f…...