重塑网页交互新篇章：Ajax三种方法的实战指南

于 2024-05-19 03:37:00 发布
阅读量822 收藏 11
点赞数 7
文章标签： 交互 ajax okhttp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/BASK2311/article/details/139034481
版权

前言

什么是ajax？

Ajax，全称为Asynchronous JavaScript and XML（异步JavaScript与XML），是一种网页开发技术，它使得网页能够在不重新加载整个页面的情况下与服务器交换数据并局部更新页面内容。这一技术极大地提高了用户体验，因为它让用户感觉网页响应更快、交互更流畅。

  • 一种异步的创建交互式网页的技术(允许网页在不完全刷新的情况下与服务器交换数据并更新部分内容)。

关键特性：

  • 异步（Asynchronous） ：这是Ajax的核心，意味着在执行Ajax请求时，用户仍然可以继续与网页的其他部分交互，而不会因为等待服务器响应而造成页面“冻结”。
  • 后台数据交换：Ajax使得浏览器在后台与服务器进行数据交换，这些数据可以是XML、JSON、HTML或者其他格式，但JSON因其轻量和易于解析的特性，现已成为最常用的格式。
  • 局部更新：通过JavaScript操作DOM（文档对象模型），可以只更新页面的部分内容，而不是整个页面重绘，提高了效率和用户体验。
  • 技术组合：Ajax并不是一个新的编程语言，而是利用现有的Web技术（如JavaScript、XML、HTML、CSS以及XMLHttpRequest对象）的一种新方式。

工作流程：

  • 用户交互：用户触发一个事件，比如点击按钮。
  • JavaScript调用：浏览器中的JavaScript代码创建一个XMLHttpRequest对象，并向服务器发送一个请求。
  • 服务器处理：服务器接收到请求后处理数据，可能查询数据库，然后返回响应，这个响应通常是JSON或XML格式的数据，也可以是HTML片段。
  • 客户端接收：JavaScript接收到来自服务器的响应，并通过DOM操作来更新页面的指定部分，展示新的数据或结果。

正文

通过连接后端来爬取电影数据，后端接口：https://mock.mengxuegu.com/mock/65a91543c4cd67421b34c898/movie/movieList#!method=get，设置一个按钮来通过点击该按钮实现将爬取到的电影数据通过无序列表展示出来。

html

 

xml
 

复制代码
 

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>jquery</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script> </head> <body> <button id="btn">获取电影列表</button> <ul id="list"> </ul> </body> </html> 
 

 

image.png
 

readyState为ajax的状态，不同的数值为不同的状态
 

  • 0 -- xhr刚创建
  • 1 -- open执行
  • 2 -- 请求发送出去，响应头被接收
  • 3 -- 响应体正在解析
  • 4 -- 解析完成
 

status为状态码
 

  •  
    1xx（信息性状态码） : 表示接收的请求正在处理。例如，100 Continue 表示请求可以继续。
     
  •  
    2xx（成功状态码） : 表示请求已成功被服务器接收、理解，并接受。最常见的如：
     
  
    • 200 OK: 请求成功，服务器已成功处理请求。
    • 201 Created: 请求成功并且服务器创建了新的资源。
    • 204 No Content: 服务器成功处理了请求，但不需要返回任何实体内容。
  •  
    3xx（重定向状态码） : 需要客户端采取进一步的操作才能完成请求。例如：
     
  
    • 301 Moved Permanently: 请求的资源已永久移动到新位置。
    • 302 Found: 临时重定向，资源临时位于其他位置。
    • 304 Not Modified: 资源未修改，可以直接使用缓存。
  •  
    4xx（客户端错误状态码） : 表示客户端的请求有误。例如：
     
  
    • 400 Bad Request: 服务器无法理解请求的格式。
    • 401 Unauthorized: 请求要求用户的身份认证。
    • 403 Forbidden: 服务器理解请求客户端的请求，但是拒绝执行此请求。
    • 404 Not Found: 服务器无法找到请求的资源。
  •  
    5xx（服务器错误状态码） : 表示服务器在处理请求的过程中发生了错误。例如：
     
  
    • 500 Internal Server Error: 服务器遇到了不知道如何处理的情况。
    • 502 Bad Gateway: 作为网关或代理工作的服务器从上游服务器收到了无效的响应。
    • 503 Service Unavailable: 服务器目前无法使用（由于超载或停机维护）。
 

XMLHttpRequest
 

思路：
 

  • 通过id来获取btn的按钮元素，并将其命名为btn，为其绑定一个监听事件，当点击该按钮的时候，触发回调函数；
  • 通过id来获取ul的列表元素，实现将爬取到的电影数据通过li显示在ul里；
  • 在回调函数中，通过new XMLHttpRequest()来创建一个ajax实例xhr；
  • 通过给xhr配置了请求的方法（GET）、请求的URL(上述给出了后端接口)以及是否异步执行（true表示异步）；
  • xhr发送Ajax请求到服务器；
  • xhr调用XMLHttpRequest对象的onreadystatechange事件绑定一个事件处理函数来监听请求的过程，该函数会在请求状态改变时被调用；
  • 判断xhr的状态码是否为4，为4则表示解析完成，再判断状态码status是否为200；
  • 满足上述条件后，通过使用JSON.parse(xhr.responseText)解析从服务器得到的响应文本为JavaScript对象，并获取里面的movieList对象；
 

xhr.responseText为：
 

 

image.png
 

 JSON.parse(xhr.responseText)为：
 

 

image.png
 

movieList为：
 

 

image.png
 

  • 通过遍历movieList对象并创建li，将其的innerText设置为获取到的电影的名字和演员，再将li加入ul中。
 

 

image.png
 

 

ini
 

复制代码
 

<script> let btn = document.getElementById('btn'); let ul = document.getElementById('list'); btn.addEventListener('click',() => { // 朝一个接口发请求，获取到数据展示在页面上 let xhr = new XMLHttpRequest(); // 创建一个ajax实例 xhr.open('GET', 'https://mock.mengxuegu.com/mock/65a91543c4cd67421b34c898/movie/movieList#!method=get', true); // 配置发送的参数 true --> 开启异步 xhr.send(); xhr.onreadystatechange = () => { // 监听请求的过程 if (xhr.readyState == 4 && xhr.status == 200){ // 拿到了后端返回的数据 // 展示在页面上 const movieList = JSON.parse(xhr.responseText).movieList； for (let i = 0; i < movieList.length; i++) { const li = document.createElement('li'); li.innerText = movieList[i].nm + '--' + movieList[i].star; ul.appendChild(li); } } } }) </script> 
 

jquery
 

导入jquery库：
 

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
 

思路：
 

  • 通过id来获取btn的按钮元素，并将其命名为btn，为其绑定一个监听事件，当点击该按钮的时候，触发回调函数；
  • 通过id来获取ul的列表元素，实现将爬取到的电影数据通过li显示在ul里；
  • 在回调函数中，通过$.ajax({ ... }) 使用jQuery的$.ajax方法来发起Ajax请求；
  • 设置请求的URL地址，上面给出了后端接口，method为设置请求的方法为GET，是一个获取数据的请求， data 设置发送给服务器的数据对象，这里指定的username和age，会在检查栏的网络中的载荷中显示出来，实际上在这个GET请求中，这些数据并不会以这种方式附加到URL上。在实际应用场景中，如果是POST请求或需要在URL中附加查询参数的GET请求，这部分会有不同的处理方式；
  • success是一个回调函数，当Ajax请求成功完成（HTTP状态码为200系列）时被调用，res参数是服务器返回的数据，通常是一个JSON对象； res为：
 

 

image.png
 

  • 获取代码解析返回的JSON对象中的movieList数组。
  • 通过循环遍历movieList数组，为每个电影创建一个<li>元素，并设置其文本内容为电影名和演员，然后将这些<li>元素追加到页面上的无序列表ul中。
 

 

ini
 

复制代码
 

<script> let btn = document.getElementById('btn'); let ul = document.getElementById('list'); btn.addEventListener('click',() => { $.ajax({ url: 'https://mock.mengxuegu.com/mock/65a91543c4cd67421b34c898/movie/movieList#!method=get', method: 'GET', data: { username:'椰汁', age:18 }, success: function(res) { const movieList = res.movieList； for (let i = 0; i < movieList.length; i++) { const li = document.createElement('li'); li.innerText = movieList[i].nm + '--' + movieList[i].star; ul.appendChild(li); } } }) }) </script> 
 

 

image.png
 

 
 

image.png
 

fetch
 

思路：
 

  • 通过id来获取btn的按钮元素，并将其命名为btn，为其绑定一个监听事件，当点击该按钮的时候，触发回调函数；
  • 通过id来获取ul的列表元素，实现将爬取到的电影数据通过li显示在ul里；
  • 在回调函数中，通过fetch("...") 发起一个HTTP GET请求到指定的URL（上面给出后端接口），URL中包含了查询字符串(username='椰汁'&age=18)，用于传递参数，在实际应用中可能用于服务器端的某些处理或过滤；
  • 通过.then((res) => {...}) fetch返回一个Promise，当请求成功完成时，第一个.then会被调用，传入的参数res是Response对象，代表了来自服务器的响应； 响应体res为：
 

 

image.png
 

  • 将响应体转换为JSON格式的Promise对象，因为原始响应体可能不是JavaScript可以直接操作的格式，然后返回；
  • 再通过第二个.then((data) => {...}) 在前一个Promise成功解析（即JSON数据准备好后）被调用，参数data是经过解析后的JSON数据，获取data中的movieList数组； data为：
 

 

image.png
 

  • 通过循环遍历movieList数组，为每个电影创建一个<li>元素，并设置其文本内容为电影名和演员，然后将这些<li>元素追加到页面上的无序列表ul中。
 

 

xml
 

复制代码
 

<script> let btn = document.getElementById('btn'); let ul = document.getElementById('list'); btn.addEventListener('click',() => { fetch("https://mock.mengxuegu.com/mock/65a91543c4cd67421b34c898/movie/movieList?username='椰汁'&age=18") .then((res) => { return res.json(); // 格式化响应体 }).then((data) => { const movieList = data.movieList; for (let i = 0; i < movieList.length; i++) { const li = document.createElement('li'); li.innerText = movieList[i].nm + '--' + movieList[i].star; ul.appendChild(li); } }) }) </script> 
 

 

image.png
 

 
 

image.png

                

        

        

        

    




    

      

        

            

              
                
                  「已注销」
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    7
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    11
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      










                



	

		

			

				
					
从概念到设计：重塑GoogleSquared

				
			

			

				

					03-01
				

			

		

		

			
				
这是一篇关于品牌设计的文章。诠释了一个品牌从无到有的过程，作者JackMorgan将其设计理念倾注在文中，对设计师来说这是一篇不可错过的好文章。GoogleSquared是2012年最初由Google伦敦推出的一个教育项目。这个项目主要为广告及其他创意领域的人员服务，鼓励人们以理论为基础在实践中学习；让参与到这个项目中的人们理解技术是如何改变社会的，并且可以将他们的行业习惯做出一些改变。能够邂逅Squared对我来说是一件非常幸运的事情，当我第一次进入Squared时，就对这个团队的远见卓识和处事方式有强烈的认同感。然而，我深深地觉得Squared迫切需要一个好的品牌形象来展示他们积极进取的工

			
		

	



                

              
                



	

		

			

				
					
人机交互新时代：多维度快速看清ChatGPT

				
			

			

				

					02-28
				

			

		

		

			
				
ChatGPT是人工智能在快速发展过程中所产生的里程碑式成果，而且这一成果
得到了全球用户前所未有的广泛参与、贡献和认可，将有效推动人工智能技术的
大规模商用普及。
 ChatGPT是有史以来用户增长最快的互联网平台。与社交媒体基于人与人之间
关系的快速获客相比，该平台作为一种开放式的互联网工具，重塑了人机关系，
其创下的用户增长“神话”标志着人机交互新时代的到来。
 ChatGPT在人工智能伦理与道德准则方面的努力也受到了肯定。不过，对于其
在歧视、作弊、欺诈、知识产权、网络安全、信息准确性、错误信息传播等方面
存在的隐患也值得关注，需要法制与监管部门跟进技术创新的步伐。

			
		

	



                


  
              

                


	

		

			

				
					
Ajax入门！！！！！

					
最新发布

				
			

			

				

					wmuj_的博客
				

				

					05-05
					
					809
					
				

			

		

		

			
				
请求方法是一些固定单词的英文，例如：GET，POST，PUT，DELETE，PATCH（这些都是http协议规定的），每个单词对应一种对服务器资源要执行的操作。浏览器网页中，使用 AJAX技术（XHR对象）发起获取省份列表数据的请求，服务器代码响应准备好的省份列表数据给前端，前端拿到数据数组以后，展示到网页。统一资源定位符，简称网址，用于定位网络中的资源（资源指的是：网页，图片，数据，视频，音频等等）标记服务器在互联网当中的方位，网络中有很多服务器，你想访问哪一台，就需要知道它的域名才可以。

			
		

	





	

		

			

				
					
AI大模型重塑新媒体变现格局：智能写作技术助力腾飞！

				
			

			

				

					程序边界
				

				

					04-24
					
					7521
					
				

			

		

		

			
				
运用好AI工具，借此我们就可以轻松写出高质量文章，做出高质量视频，甚至直播也可以借此轻松变现。在本书中，笔者重点讲解了13款人工智能应用在新媒体变现中的技巧和方法。本书共分为8章，分别讲解了常见的人工智能以及人工智能影响下的广告流量变现、商业合作变现、直播变现、 私域变现和IP变现等。此外，本书还对未来的人工智能与新媒体变现做了趋势分析。本书适合写作、视频、直播类新媒体从业人员以及相关培训机构参考使用。

			
		

	



		

			
		



	

		

			

				
					
ChatGPT进阶：提示工程的神秘面纱与实战指南

				
			

			

				

					程序边界
				

				

					11-27
					
					7565
					
				

			

		

		

			
				
提示工程是对话系统中一个关键的环节，它对于提高模型的输出质量和效果具有关键的作用。通过深入理解和掌握提示工程的原理和方法，我们可以更好地利用ChatGPT等先进的对话模型，为实际应用带来更大的价值。在未来的研究和应用中，我们还需要不断探索和创新，以应对提示工程面临的挑战和问题。本书是一本面向所有人的提示工程工具书，旨在帮助你掌握并有效利用以ChatGPT为代表的AI工具。学习完本书后，你将能够自如地将ChatGPT运用在生活和专业领域中，成为ChatGPT进阶玩家。

			
		

	





	

		

			

				
					
AI赋能金融创新：ChatGPT引领量化交易新时代

				
			

			

				

					程序边界
				

				

					12-26
					
					1万+
					
				

			

		

		

			
				
本书是一本旨在帮助架构师在人工智能时代展翅高飞的实用指南。全书以ChatGPT为核心工具，揭示了人工智能技术对架构师的角色和职责进行颠覆和重塑的关键点。本书通过共计 13 章的系统内容，深入探讨AI技术在架构设计中的应用，以及AI对传统架构师工作方式的影响。通过学习，读者将了解如何利用ChatGPT这一强大的智能辅助工具，提升架构师的工作效率和创造力。本书的读者主要是架构师及相关从业人员。

			
		

	





	

		

			

				
					
探索 AJAX 技术：实现动态数据交互的前端利器

				
			

			

				

					明哥
				

				

					08-07
					
					1245
					
				

			

		

		

			
				
简介：AJAX（Asynchronous JavaScript and XML）技术在 Web 前端开发中扮演着重要的角色，它通过异步通信和动态内容更新，为用户带来更好的交互体验。本篇笔记将详细探索 AJAX 技术，并通过生动的代码演示来展示其在实现动态数据交互方面的优势。

			
		

	





	

		

			

				
					
【Ajax】实现网页与服务器之间的数据交互

				
			

			

				

					m0_53619602的博客
				

				

					08-04
					
					2547
					
				

			

		

		

			
				
全称 Asynchronous javascript And XML(异步JavaScript 和XML)通俗的理解： 在网页中来利用XMLHttpRequest对象和服务器进行数据交互的方式，就是 AjaxAjax能让我们轻松实现网页于服务器之间的数据交互表单在网页中主要负责数据采集功能html中的标签，就是用于采集用户输入的信息，并通过标签的提交操作，把采集到的信息提交到服务器端进行处理axios是专注于网络数据请求的库相比于原生的XMLHttpRequest对象，axios简单易用。...

			
		

	





	

		

			

				
					
Ajax 前后端数据交互

				
			

			

				

					kk的博客
				

				

					08-17
					
					1万+
					
				

			

		

		

			
				
一篇文章搞懂ajax

			
		

	





	

		

			

				
					
SpringMVC与Ajax数据交互

				
			

			

				

					jialiang的博客
				

				

					09-08
					
					2180
					
				

			

		

		

			
				
简单说下需求，页面通过ajax发送一个json数据，controller控制器接收到json数据后，以此为条件在数据库中进行查询。将查询到的对象返回给页面

			
		

	





	

		

			

				
					
Ajax清晰请求步骤与代码

					
热门推荐

				
			

			

				

					西瓜皮儿的皮儿
				

				

					04-17
					
					7万+
					
				

			

		

		

			
				
异步请求ajax的使用在前后台传递数据，优化用户体验起着至关重要的角色，那么下面给大家简单罗列了一下ajax请求的步骤与代码。

一、原生JS中的Ajax：

1、使用ajax发送数据的步骤

第一步：创建异步对象



var xhr = new XMLHttpRequest();



第二步：设置 请求行 open(请求方式，请求url):



// get请求如果有参数就需要在...

			
		

	





	

		

			

				
					
从颠覆到重塑：欧洲供应链的未来（英）.pdf

				
			

			

				

					06-14
				

			

		

		

			
				
通过应用新技术、新材料和新模式，供应链可以变得更加智能、灵活和可靠。 Accenture 的研究表明，到 2025 年，供应链创新将在欧洲市场上达到 30% 的市场份额。  5. Accenture 的供应链管理经验  Accenture 是一家...

			
		

	





	

		

			

				
					
工业4.0时代：2022年重塑行业未来调查报告.pdf

				
			

			

				

					06-30
				

			

		

		

			
				
工业4.0时代：2022年重塑行业未来调查报告.pd

			
		

	





	

		

			

				
					
AI绘画与修图：重塑数字艺术的新纪元

				
			

			

				

					程序边界
				

				

					02-23
					
					7545
					
				

			

		

		

			
				
本书内容共13章5个部分，第一部分主要讲解新版Photoshop绘画基础及常用操作，如何创建选区精准选择需要的图像部分，AI绘画智能填充与合成图像的操作；第二部分主要介绍风景照片、人物照片、产品照片和动物照片的快捷修饰方法，AI人工智能调整图像色彩，AI人像创意效果设计，运用Camera Raw的AI功能等内容；第三部分主要介绍使用Firefly关键词生成图像，生成填充功能应用，调出吸人眼球的文本特效等内容；第四部分介绍利用多种样式制作画面的 艺术效果，为SVG矢量图像快速着色等操作方法；

			
		

	





	

		

			

				
					
AI摄影绘画与PS优化：重塑数字艺术的未来

				
			

			

				

					程序边界
				

				

					12-18
					
					7406
					
				

			

		

		

			
				
AI 摄影绘画与 PS 优化从入门到精通》介绍了 AI 摄影绘画的相关内容，从文案到图片生成，再到 PS 优化，是一本 AI 摄影绘画的入门指南与实战教程。书中包含 11 大专题，通过技能线和案例线展开：技能线，讲解了 ChatGPT 指令生成、Midjourney 绘画技巧、专业摄影指令、画面构图指令、光线色调指令、风格渲染指令、PS 修图优化、PS 智能优化等内容；案例线，介绍了人像、风光、花卉、动物、慢门、星空、航拍、全景等多种摄影题材作品的绘画，还通过一个完整的案例来帮助读者融会贯通所学知识。

			
		

	





	

		

			

				
					
Pandas：DataFrame的完整指南

				
			

			

				

					一键难忘的博客
				

				

					02-17
					
					5878
					
				

			

		

		

			
				
Pandas是Python中最流行的数据处理库之一，而其中的DataFrame对象是数据处理的核心。DataFrame为我们提供了一个强大而灵活的数据结构，使得数据的清洗、分析和可视化变得更加简便。在本文中，我们将深入探讨Pandas DataFrame对象的基础知识，并提供实际代码示例和详细解析，帮助读者更好地理解和运用DataFrame。

			
		

	





	

		

			

				
					
Android双目三维重建：Android双目摄像头实现双目测距

				
			

			

				

					AI吃大瓜的博客
				

				

					03-25
					
					5869
					
				

			

		

		

			
				
Android双目三维重建：Android双目摄像头实现双目测距
Android实现双目测距，Android双目三维重建，opencv三维重建，opencv双目测距

			
		

	





	

		

			

				
					
ajax前后端数据交互(简单的登录demo)

				
			

			

				

					pirate_zhangfan的博客
				

				

					09-05
					
					2万+
					
				

			

		

		

			
				
前端：

html：



js(ajax)：











js(记住密码)：



后端：

Apiresponse:



UserController:

登陆验证：





设置cookie:



从cookie获取用户名密码并向前端传参：



配置session拦截器：



...

			
		

	





	

		

			

				
					
Ajax、jquery实现前后台数据交互

				
			

			

				

					诗和远方
				

				

					04-10
					
					5093
					
				

			

		

		

			
				
前端发送数据，然后接收后台的返回数据
//‘/_relay_single’是路由函数，用于前后台连接，后台需要有此函数来完成对前端传输数据的操作，data是后台返回的数据
function single_relay( n ){
    $.getJSON( $SCRIPT_ROOT + '/_relay_single', {
        relay_num: n
}, function(data

			
		

	





	

		

			

				
					
圣农发展(002299.sz):白鸡龙头,估值重塑 pdf

				
			

			

				

					01-08
				

			

		

		

			
				
此外，圣农发展还致力于推进产业链的延伸和升级，通过整合资源、提高供应链效率等举措，加强了公司的核心竞争力，也为估值重塑提供了有力支撑。  总的来说，圣农发展作为白鸡龙头企业，具有稳定的盈利能力和强大的...

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值