jquery---ajax方法示例

news2024/11/18 11:22:11

 ajax方法

$.ajax({name:value, name:value, ... })

 ajax方法有一个参数,一定长度的对象,内部指定了ajax的请求地址和格式,方式等等,它可以有以下的属性和值

示例 

这里展示了一个简单的get请求图片url的实例

let data;
let url = "https://picsum.photos/v2/list";

$(document).ready(function(){
    $("#bt").click(function(){
        $.ajax({
            type: "get",//可选,请求方式,默认为get
            url: url,//必选,请求的url
            data: {// 可选,设置参数
                page:2,
                limit :10
            },
            dataType: "",// 可选,请求结果的数据类型,比如:application/json
            success: function (response) {// 请求成功的操作
                console.log(response);
                data = response;
                for(item of data){// 把图片渲染到页面
                    console.log(item.download_url);
                    let img = $("<img>").attr('src',item.download_url).attr("width",200);
                    $("body").append(img);
                }
            },
            error:function(){// 请求失败的操作
                console.log("请求失败")
            }
        });
    })
});
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ajax</title>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
    <button id="bt">click</button>
</body>
<script src="ajax.js"></script>
</html>

结果展示

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

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

相关文章

了解运维基础

一、运维概述 1、运维岗位的收入情况 2、运维的职位定义 什么是运维&#xff1f; 在技术人员之间&#xff0c;一致对运维有一个开玩笑的认知&#xff1a;运维就是修电脑的、装网线的、背锅的岗位。 其实不然&#xff0c;运维是一个非常广泛的定义&#xff0c;在不同的公司不同…

宏基因组分析流程(Metagenomic workflow)202405|持续更新

Logs 增加R包pctax内的一些帮助上游分析的小脚本&#xff08;2024.03.03&#xff09;增加Mmseqs2用于去冗余&#xff0c;基因聚类的速度非常快&#xff0c;且随序列量线性增长&#xff08;2024.03.12&#xff09;更新全文细节&#xff08;2024.05.29&#xff09; 注意&#x…

Altium Designer软件下载安装「专业PCB设计软件」Altium Designer安装包获取!

Altium Designer&#xff0c;这款软件凭借其全面的设计流程覆盖&#xff0c;从概念到实现&#xff0c;都能为电子工程师提供强大的支持。 在硬件设计方面&#xff0c;Altium Designer提供了丰富的元件库和灵活的布局选项&#xff0c;使得工程师能够轻松地进行电路设计&#xff…

万亿国债消防救援——北斗应急通讯设备类目推荐

近期&#xff0c;云贵川地区山火肆虐&#xff0c;山火大范围、远距离、独立密集地发生&#xff0c;给消防救援带来了巨大挑战。 消防应急工作是保障人民生命财产安全的重要环节&#xff0c;它涉及到预防火灾、及时应对火灾事故以及灾后恢复等多个方面。在应对火灾、事故和其他…

【旧文更新】【优秀课设】基于FPGA的Verilog HDL自动售货机

【旧文更新】基于FPGA的Verilog HDL自动售货机 文章目录 关于旧文新发FPGACortex-M架构SysTick系统定时器阻塞和非阻塞延时 附录&#xff1a;压缩字符串、大小端格式转换压缩字符串浮点数压缩Packed-ASCII字符串 大小端转换什么是大端和小端数据传输中的大小端总结大小端转换函…

数字化学校渠道的建造内容

数字化学校渠道的建造内容可以用阶段来区分&#xff1a; 1.网络硬件为主的建造 这一阶段首要重视的是学校网络的硬件基础建造&#xff0c;一起供给部分网络根本服务&#xff0c;与此一起&#xff0c;也进行部分信息使用内容的建造&#xff0c;如电子阅览室、归纳管理信息体系等…

CompletableFuture 异步与最佳实践

文章目录 CompletableFuture 异步-前言背景主要特性1. 异步任务执行2. 任务组合3. 异常处理4. 回调机制 最佳实践并行调用多个接口处理异常超时设置使用 Executor 自定义线程池总结 总结 CompletableFuture 异步-前言 在现代Java开发中&#xff0c;处理并发任务和异步编程已成…

Nginx配置及优化

Nginx配置及优化 前言nginx.conf拆分理解上线 最近在配置Nginx的时候&#xff0c;偶尔一些细致的理论有些模糊&#xff0c;配置起来费了点功夫&#xff0c;今天来详细写一下我个人的理解&#xff0c;文章参考了一些官网和其他优秀博主的文章http://t.csdnimg.cn/GbID9。 前言 …

[leetcode hot150]第二百三十六题,二叉树的最近公共祖先

题目&#xff1a; 给定一个二叉树, 找到该树中两个指定节点的最近公共祖先。 百度百科中最近公共祖先的定义为&#xff1a;“对于有根树 T 的两个节点 p、q&#xff0c;最近公共祖先表示为一个节点 x&#xff0c;满足 x 是 p、q 的祖先且 x 的深度尽可能大&#xff08;一个…

测试基础07:测试工作流程规范、进度同步与把控

课程大纲 1、迭代测试流程 2、测试流程 2.1、测试用例评审 目的&#xff1a;对齐产品需求理解&#xff0c;完善、优化测试场景。 参与方&#xff1a;项目、产品、开发、测试。 用例内容&#xff1a;冒烟用例&#xff08;主流程&#xff09; 功能用例。 2.2、冒烟测试 提测…

ADF: 获取Data Lake Storage上的文件列表并根据文件名删除文件

假设 Data Lake 上有个test的文件夹&#xff0c;有如下文件 目标&#xff1a;使用Azure Data Factory的Pipeline获取这个目录下的文件名列表&#xff0c;并删除掉以"ETC"开头的文件。 步骤&#xff1a; 1. 需要在Linked services中新建一个能连接到Data Lake的连接…

javaScript 换行符的使用

最近新接收了一个项目&#xff0c;再做一个小功能点时&#xff0c;字符串需要增加换行&#xff0c;小小记录一下 1、标签换行 <br> 2、字符换行 \n&#xff0c;换行就是转到下一行输出。例如&#xff1a; console.log("hello\nworld!"); 在终端中将输出 he…

橙派探险记:开箱香橙派 AIpro 与疲劳驾驶检测的奇幻之旅

目录 引子&#xff1a;神秘包裹的到来 第一章&#xff1a;香橙派AIpro初体验 资源与性能介绍 系统烧录 Linux 镜像&#xff08;TF 卡&#xff09; 调试模式 登录模式 第二章&#xff1a;大胆的项目构想 系统架构设计 香橙派 AIpro 在项目中的重要作用 第三章&#xf…

C++模拟实现stack和queue

1 stack 1.1概念 stl栈 1.2栈概念 1.3代码 2 queue 2.1概念 stl队列 2.2队列概念 2.3代码

OLED显示一张图片

1.思路: void Oled_Show_Image(unsigned char *image) // { unsigned char i; //-128 ~ 127位 unsigned int j; //j要重新定义&#xff0c;因为要到达图片的最后一位 //行 i没有问题&#xff0c;j有问题 i为1时&am…

Ps系统教程03

选区工具的组合使用 先用魔棒将大致区域点击圈主 会发现一些零散的小区域 使用套索工具进行区域的加减&#xff08;按住shift/alt键进行相关区域加减&#xff09; 可以放大查看 基本处理完细节之后 如果把不用的填充背景直接按delete删除&#xff0c;那么原版图案就会…

QT C++ 读写mySQL数据库 图片 例子

在上篇文章中描述了怎样搭建读写数据库的环境。 本文更进一步&#xff0c;描述了读写mySQL数据库&#xff0c;字符、整型数字、图片。读写图片相对难点。 数据库的图片字段用BLOB&#xff0c;如果图片较大要用longblob,否则会报错。 另外&#xff0c;读写数据库都使用了短连…

DNS分离解析、多域名解析以及DNS子域试验

一、DNS分离解析 有些时候&#xff0c;对不同网络中的计算机进行DNS解析时&#xff0c;需要进行"区别对待"&#xff0c;不同的主机请求服务器解析相同的域名&#xff0c;得到的IP地址也会不同。比如来自内网和外网的不同网段地址的客户机请求解析同一域名时&#xff…

简介有限面积和无限周长

前言 分形理论是一种非常重要的科学概念,它被广泛应用于物理学、数学、生物学等领域。分形理论描述了一种重复自相似的结构,这种结构在不同的尺度上都具有类似的形态。由于分形理论的应用广泛且深远,了解分形理论可以帮助人们更好地理解自然界和人造世界中的现象。 作为一…

docker占用磁盘空间大小排查

首先进入到 /var/lib/docker/overlay2 目录下,查看谁占用的较多 cd /var/lib/docker/overlay2/du -s ./* | sort -rn | more再通过目录名查找容器名 docker ps -q | xargs docker inspect --format {{.State.Pid}}, {{.Id}}, {{.Name}}, {{.GraphDriver.Data.WorkDir}} | gre…