【ajax基础02】URL详解

目录

一:什么是URL

二:URL组成

协议

​编辑

域名(在url中必须写)

资源路径

三:URL查询参数

定义:

语法格式:

如何利用axios实现特定数据查询:

语法格式:

案例:

1 单地区查询

2 多地区查询

四:如何赚钱

一:什么是URL

统一资源定位符(Uniform Resource Locator,缩写:URL),简称网址

二:URL组成

https://baidu.com/index.html

协议

https协议:超文本传输协议,规定了浏览器和服务第之间传输数据的格式

域名(在url中必须写)

域名:标记服务器在互联网中方位

如果不写就找不到对应的服务器,也就找不到对应服务器中的资源。

例如有www.baidu.com百度服务器、www.taobao.com淘宝服务器等互联网中的其它服务器

资源路径

资源路径:标记资源在服务器中的具体位置

三:URL查询参数

定义:

浏览器提供给服务器的额外信息,让服务器返回浏览器想要的数据

语法格式:

http://xxx.com/xxx?参数名1 = 值1&参数名2 = 值2

?后的内容即为url中的查询参数,通过特定的查询要求,去进行特定数据的获取

如何利用axios实现特定数据查询:

axios函数中提供了params选项,用于携带查询参数,将其拼接到url?参数名=值

语法格式:

axios({url:'网址',params:{参数名:值}
}).then(result=>{//对获取的数据进行的处理
})

案例:

1 单地区查询

获取省份列表下,辽宁省下市的数据

<body><div class="p-name"></div><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>axios({url: 'https://hmajax.itheima.net/api/city',params: {pname: '辽宁省'}}).then(result => {console.log(result);document.querySelector('.p-name').innerHTML = result.data.list.join('<br>')})</script>
</body>
2 多地区查询

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><p>省份名称:</p><input type="text" class="province"><p>城市名称:</p><input type="text" class="area"><button class="btn">查询</button><p>地区列表:</p><ul class="end"></ul><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>//点击完按钮后,实现数据的查询document.querySelector('.btn').addEventListener('click', function () {const pro = document.querySelector('.province').valueconst area = document.querySelector('.area').valueaxios({url: 'https://hmajax.itheima.net/api/area',params: {pname: pro,cname: area}}).then(result => {// console.log(result);document.querySelector('.end').innerHTML = result.data.list.join('<br>')})})</script>
</body></html>

四:如何赚钱

现在是否厌倦了程序员朝九晚五的生活,想给自己生活寻找另一条路径;在校大学生是否愿意在校进行人生中的第一次创业,获取人生第一桶金;是否正在看此篇文章的你愿意通过五年努力,让自己开上梦想的中的车子;

那就从提升认知开始,加入微木的知识星球:微木的创业思考

专属于创业者的交流集中地,创业、认知提升找微木!

1 创业底层方法论

2 从千万本书书籍中挑选出的,人生必读书目清单。

3 认知提升学习资源(秘密)

4 寻找赚钱项目底层方法论

5 好书精华提炼

6 深度链接微木

每天仅需0.3元/天,欢迎加入专属于创业者的交流集中地,创业、赚钱、认知提升找微木!

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

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

相关文章

springboot-自动配置

一、自动配置的原理 Spring Boot 的自动配置基于以下几个核心概念&#xff1a; 条件注解 (Conditional Annotations)&#xff1a;Conditional 系列注解用于根据特定条件判断是否加载某个配置类或 Bean。 自动配置类 (Auto-configuration Classes)&#xff1a;这些类通过 META-…

【耐水好】强耐水UV胶水它的粘接强度和普通UV胶水比如何呢

【耐水好】强耐水UV胶水它的粘接强度和普通UV胶水比如何呢 强耐水UV胶水的粘接强度与普通UV胶水相比&#xff0c;具有显著的优势。以下是详细的比较和归纳&#xff1a; 固化方式&#xff1a; 两者都是通过紫外线&#xff08;UV&#xff09;照射进行固化&#xff0c;但强耐水UV…

2024年全球架构师峰会(ArchSummit深圳站)

前言 ArchSummit全球架构师峰会是极客邦科技旗下InfoQ中国团队推出的重点面向高端技术管理者、架构师的技术会议&#xff0c;54%参会者拥有8年以上工作经验。 ArchSummit聚焦业界强大的技术成果&#xff0c;秉承“实践第一、案例为主”的原则&#xff0c;展示先进技术在行业中的…

程序员学CFA——经济学(三)

经济学&#xff08;三&#xff09; 总产出、价格水平和经济增长总产出、总收入和总支出总产出、总收入和总支出的概念及联系国内生产总值国内生产总值&#xff08;GDP&#xff09;的定义GDP的衡量方法GDP的相关概念GDP的核算方法 总需求、总供给和市场均衡总需求总需求及其假设…

React.FC`<ChildComponentProps>`解释

代码场景 ParentComponent.tsx import React, { useState } from react; import ChildComponent from ./ChildComponent;function ParentComponent() {const [childData, setChildData] useState<string>();const handleChildData (data: string) > { // 可以直接…

MyBatis的缓存功能总结

MyBatis的缓存功能总结 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01; 1. 缓存概述 MyBatis的缓存功能是为了提高数据库访问效率而设计的。通过缓存&#xff…

Netty中Reactor线程的运行逻辑

Netty中的Reactor线程主要干三件事情&#xff1a; 轮询注册在Reactor上的所有Channel感兴趣的IO就绪事件。 处理Channel上的IO就绪事件。 执行Netty中的异步任务。 正是这三个部分组成了Reactor的运行框架&#xff0c;那么我们现在来看下这个运行框架具体是怎么运转的~~ 这…

【八股系列】怎么处理项目中的异常捕获行为?(js)

文章目录 1. 基本的try-catch-finally结构2. 全局异常处理3. 自定义错误类4. 使用Promise的catch5. 异步函数中的try-catch6. 记录日志7. 用户友好的错误提示 在 JavaScript项目中&#xff0c;合理地处理异常捕获对于提高程序的健壮性和用户体验至关重要。以下是一些关键实践和…

设计模式-结构型-06-桥接模式

1、传统方式解决手机操作问题 现在对不同手机类型的不同品牌实现操作编程&#xff08;比如&#xff1a;开机、关机、上网&#xff0c;打电话等&#xff09;&#xff0c;如图&#xff1a; UML 类图 问题分析 扩展性问题&#xff08;类爆炸&#xff09;&#xff1a;如果我们再…

shell脚本内使用ifconfig命令

脚本在定时任务中没有取出ip&#xff0c;说明ifconfig命令没有执行成功&#xff0c;就是没有找到ifconfig&#xff0c;与PATH环境变量有关&#xff0c;PATH环境变量在/etc/profile文件中设置&#xff0c;而定时任务却是以nologin方式调用脚本&#xff0c;不会加载/etc/profile,…

探讨 MyBatis 特殊 SQL 执行技巧与注意事项

在线工具站 推荐一个程序员在线工具站&#xff1a;程序员常用工具&#xff08;http://cxytools.com&#xff09;&#xff0c;有时间戳、JSON格式化、文本对比、HASH生成、UUID生成等常用工具&#xff0c;效率加倍嘎嘎好用。 程序员资料站 推荐一个程序员编程资料站&#xff1a;…

Zygote进程的理解

Zygote进程是安卓系统的一个重要进程&#xff0c;由init进程创建而来&#xff1b;另外系统里的重要进程&#xff08;system_server等&#xff09;都是由zygote进程fork的&#xff0c;所有的app进程也是由zygote进程fork的。 一、C 里的fork函数 fork是Linux里面创建子进程的函…

电池荷电状态估计SOC?电池管理系统

一、背景 电池荷电状态&#xff08;SOC, State of Charge&#xff09;估计是电池管理系统&#xff08;BMS, Battery Management System&#xff09;的关键功能之一&#xff0c;对于确保电池的安全高效运行至关重要&#xff0c;特别是在电动车、储能系统以及便携式电子设备等领…

LCL滤波器并网逆变器双闭环控制系统仿真

并网逆变器通常采用L滤波器&#xff0c;虽然结构和控制简单&#xff0c;但是随着功率级别的增加&#xff0c;体积重量增大等问题也日益突出。为了解决这个问题&#xff0c;人们开始使用LCL滤波器&#xff0c;这种滤波器在功率较大的场合表现出色。 无源滤波器&#xff0c;又称…

Android使用data uri启动activity或service

设定AndroidManifest.xml 在AndroidManifest.xml文件中&#xff0c;我们可以设定activity或service的data。 <!-- activity定义方式 --> <activityandroid:name".page.main.MainActivity"><intent-filter><action android:name"an…

神经网络模型---ResNet

一、ResNet 1.导入包 import tensorflow as tf from tensorflow.keras import layers, models, datasets, optimizersoptimizers是用于更新模型参数以最小化损失函数的算法 2.加载数据集、归一化、转为独热编码的内容一致 3.增加颜色通道 train_images train_images[...,…

QML语法

文章目录 QML属性 QML QML是一种描述用户界面的声明式语言。它将用户界面分解成一些更小的元素&#xff0c;这 些元素能够结合成一个组件。QML语言描述了用户界面元素的形状和行为。用户界 面能够使用JavaScript来提供修饰&#xff0c;或者增加更加复杂的逻辑。从这个角度来看…

Linux 系统图像化编程GTK入门

环境前期准备 演示环境&#xff1a;Windows 11 Ubuntu 22.04.4 VS Code 前提条件&#xff1a;1、Windows 11 子系统Ubuntu 22.04.4 已经安装图形化界面&#xff0c;如果没有安装请参考文章&#xff1a; windows11子系统Ubuntu 22.04.4子安装图形化界面 2、Ubuntu 22.04.4…

C语言笔记第16篇:编译和链接

1、翻译环境和运行环境 在ANSI C的任何一种实现中&#xff0c;存在两个不同的环境。 第1种是翻译环境&#xff0c;在这个环境中源代码被转换为可执行机器指令&#xff08;二进制指令&#xff09; 第2种是执行环境&#xff0c;它用于实际执行代码 2、翻译环境 那翻译环境是怎…

数据资产管理的未来趋势:洞察技术前沿,探讨数据资产管理在云计算、大数据、区块链等新技术下的发展趋势

一、引言 随着信息技术的飞速发展&#xff0c;数据已成为企业最重要的资产之一。数据资产管理作为企业核心竞争力的关键组成部分&#xff0c;其发展趋势和技术创新受到了广泛关注。特别是在云计算、大数据、区块链等新技术不断涌现的背景下&#xff0c;数据资产管理面临着前所…