【JavaWeb】异步请求——AJAX

已于 2024-04-17 09:18:02 修改
阅读量718 收藏 8
点赞数 6
分类专栏： Java 文章标签： ajax 前端 javascript 后端 web java java-ee
于 2024-04-12 17:22:56 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_37833693/article/details/137591522
版权

目录

Ajax（Asynchronous JavaScript and XML）

  • 使用JavaScript 和 XML实现的异步刷新技术
  • Ajax不是新的编程语言，而是一种使用现有标准的新方法
  • Ajax是一种在无需重新加载整个网页的情况下，能够与服务器交换数据并更新部分网页的技术
  • Ajax最大的优点是页面无刷新，用户的体验非常好。并且使用异步方式与服务器通信，具有更加迅速的响应能力

优点

  • 我们可以使用Ajax进行无刷新，无刷新是指不刷新整个页面，只刷新局部。
  • 无刷新的好处: 只更新部分页面，有效利用带宽，提高用户体验
    • 只更新部分页面，有效利用带宽
    • 提供连续的用户体验
    • 提供类似C/S的交互效果，
    • 操作更方便

传统Web与Ajax的差异

差异说明
发送请求方式不同传统Web 浏览器发送同步请求
Ajax技术 异步引擎对象发送请求
服务器响应不同传统Web 响应内容是一个完整页面
Ajax技术 响应内容只是需要的数据
客户端处理方式不同传统Web 需等待服务器响应完成并重新加载整个页面后用户才能进行操作
Ajax技术 可以动态更新页面中的部分内容,不影响用户在页面进行其他操作

Ajax工作流程

在这里插入图片描述

Ajax 经典应用场景

  • 搜索引擎根据用户输入关键字，自动提示检索关键字
  • 动态加载数据，按需取得数据【树形菜单、联动菜单…】
  • 改善用户体验。【输入内容前提示、带进度条文件上传…】
  • 电子商务应用。 【购物车、邮件订阅…】
  • 访问第三方服务。【访问搜索服务、rss 阅读器】
  • 页面局部刷新

XMLHttpRequest

  • 整个Ajax技术的核心
  • 提供异步发送请求的能力

常用方法

方 法说 明
open( String method, String url, boolean async, String user, String password )创建一个新的HTTP请求
send( String data )发送请求到服务器端
abort( )取消当前请求
setRequestHeader( String header, String value )设置请求的某个HTTP头信息
getResponseHeader( String header )获取响应的指定HTTP头信息
getAllResponseHeader( )获取响应的所有HTTP头信息

事件

  • onreadystatechange：指定回调函数

常用属性

  • readyState：XMLHttpRequest的状态信息
就绪状态码说 明
0XMLHttpRequest对象未完成初始化
1XMLHttpRequest对象开始发送请求
2XMLHttpRequest对象的请求发送完成
3XMLHttpRequest对象开始读取响应
4XMLHttpRequest对象读取响应结束
  • status：HTTP的状态码
状态码说 明
200服务器正确返回响应
404请求的资源不存在
500服务器内部错误
403没有访问权限
………
  • statusText：返回当前请求的响应状态
  • responseText：以文本形式获得响应的内容
  • responseXML：将XML格式的响应内容解析成DOM对象

ajax: GET请求和POST请求的区别

步 骤请求方式实 现 代 码
初始化组件GETxmlHttpRequest.open( “GET”, url, true );
初始化组件POSTxmlHttpRequest.open( “POST”, url, true );
xmlHttpRequest.setRequestHeader( “Content-Type”,“application/x-www-form-urlencoded” );
发送请求GETxmlHttpRequest.send( null );
发送请求POSTxmlHttpRequest.send(“key=xxx&type=12&year=20124” );

传统Ajax实现

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册</title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
	function validate() {
		var name = $("#name").val();
		if (name == null || name == "") {
			$("#nameDiv").html("用户名不能为空！");
		} else {
			//1.创建XMLHttpRequest对象
			xmlHttpRequest = createXmlHttpRequest();
			//2.设置回调函数
			xmlHttpRequest.onreadystatechange = callBack;
			//3.初始化XMLHttpRequest组件
			var url = "userServlet?name=" + name;//服务器端URL地址,name为用户名文本框获取的值
			xmlHttpRequest.open("GET", url, true);
			//4.发送请求
			xmlHttpRequest.send(null);
			/* 使用POST方式发送请求
			var url = "userServlet";//服务器端URL地址
			xmlHttpRequest.open("POST", url, true);
			xmlHttpRequest.setRequestHeader("Content-Type",
					"application/x-www-form-urlencoded");
			var data = "name=" + name;//需要发送的数据信息,name为用户名文本框获取的值
			xmlHttpRequest.send(data);
            */
			//Ajax 回调函数
			function callBack() {
				if (xmlHttpRequest.readyState == 4
						&& xmlHttpRequest.status == 200) {
					var data = xmlHttpRequest.responseText;
					if (data == "true") {
						$("#nameDiv").html("用户名已被使用！");
					} else {
						$("#nameDiv").html("用户名可以使用！");
					}
				}
			}//end of callBack()
		}
	}//end of validate()

	/*
	 *创建XMLHttpRequest对象
	 */
	function createXmlHttpRequest() {
		if (window.XMLHttpRequest) {//返回值为true时说明是新版本IE或其他浏览器
			return new XMLHttpRequest();
		} else {//返回值为false时说明是老版本IE浏览器（IE5和IE6）
			return new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
</script>
</head>
<body>
	<form action="" id="form1">
		<table>
			<tr>
				<td>用 户 名：</td>
				<td><input type="text" name="name" id="name"
					onblur="validate();" />&nbsp;<font color="#c00fff">*</font></td>
				<td>
					<div id="nameDiv" style="display: inline"></div></td>
			</tr>
		</table>
	</form>
</body>
</html>

传统方式实现Ajax的不足

  1. 步骤繁琐
  2. 方法、属性、常用值较多不好记忆
  3. 处理复杂结构的响应数据（如XML格式）比较烦琐
  4. 浏览器兼容问题

jQuery将Ajax相关操作都进行了封装

$.ajax()

语法

$.ajax( [settings] );

$.ajax( {
      "url"      :  "url",      	// 要提交的URL路径
      "type"     :  "get",        	// 发送请求的方式
      "data"     :  data,         	// 要发送到服务器的数据
      "dataType" :  "text",           	// 指定传输的数据格式
      "success"  :  function(result) {  // 请求成功后要执行的代码
	   },
      "error"    :  function() {  	// 请求失败后要执行的代码
	   }
} );

常用属性参数

参 数类 型说 明
urlString发送请求的地址，默认为当前页地址
typeString请求方式，默认为GET
dataPlainObject或 String或Array发送到服务器的数据
dataTypeString预期服务器返回的数据类型，包括：XML、HTML、Script、JSON、JSONP、text
timeoutNumber设置请求超时时间
globalBoolean表示是否触发全局Ajax事件，默认为true

常用函数参数

参 数类 型说 明
beforeSendFunction ( jqXHR jqxhr,PlainObject settings )发送请求前调用的函数
successFunction( 任意类型 result,String textStatus, jqXHR jqxhr )请求成功后调用的函数
参数result：可选，由服务器返回的数据
errorFunction ( jqXHR jqxhr, String textStatus, String errorThrown)请求失败时调用的函数
completeFunction ( jqXHR jqxhr,String textStatus )请求完成后（无论成功还是失败）调用的函数
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册</title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$("#name").blur(function() {
		var name = this.value;
		if (name == null || name == "") {
			$("#nameDiv").html("用户名不能为空！");
		} else {
			$.ajax({
                "url"       : "userServlet",   //要提交的URL路径
                "type"      : "GET",           //发送请求的方式
                "data"      : "name="+name,    //要发送到服务器的数据
                "dataType"  : "text",          //指定返回的数据格式
                "success"   : callBack,        //响应成功后要执行的代码
                "error"     : function() {     //请求失败后要执行的代码
                    alert("用户名验证时出现错误，请稍后再试或与管理员联系！");
                }
            });

			//响应成功时的回调函数
			function callBack(data) {
				if (data == "true") {
					$("#nameDiv").html("用户名已被使用！");
				} else {
					$("#nameDiv").html("用户名可以使用！");
				}
			}//end of callBack()
		}
	});//end of blur()
});
</script>
</head>
<body>
	<form action="" id="form1">
		<table>
			<tr>
				<td>用 户 名：</td>
				<td><input type="text" name="name" id="name" />&nbsp;<font color="#c00fff">*</font></td>
				<td>
					<div id="nameDiv" style="display: inline"></div></td>
			</tr>
		</table>
	</form>
</body>
</html>

后台servlet：

	public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String name = request.getParameter("name");
        boolean used = false;
        if("ajax".equals(name)){
            used = true;
        }else{
            used = false;
        }
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        out.print(used);
        out.flush();
        out.close();
    }

Ajax的其他方法

$.get()

语法

$.get( url [, data] [, success] [, dataType] );

$.get( url, data, function( result ) {
	// 省略将服务器返回的数据显示到页面的代码
} );

以上代码等价于

$.ajax( {
	"url"           : url,
	"data"        : data,
	"type"        : "get",
	"success" : function( result ) {
		   // 省略代码
	      }
} );

$.post()

语法

$.post( url [, data] [, success] [, dataType] );

$.post( url, data, function( result ) {
	// 省略将服务器返回的数据显示到页面的代码
} );

以上代码等价于

$.ajax( {
	"url"           : url,
	"data"        : data,
	"type"        : "post",
	"success" : function( result ) {
		   // 省略代码
	      }
} );

$.getJson()

语法

$.getJSON( url [, data] [, success] );

$.getJSON( url, data, function( result ) {
	// 省略将服务器返回的数据显示到页面的代码
} );

以上代码等价于

$.ajax( {
	"url"            : url,
	"data"         : data,
	"type"         : "get",
	"dataType" : "json",
	"success"   : function( result ) {
		   // 省略代码
	      }
} );

.load() [了解]

  • 返回HTML内容并设置到元素中
  • 不是全局函数
  • 匿名的回调函数
  • 默认使用GET方式

JSON（JavaScript Object Notation）

  • 一种轻量级的数据交换格式
  • 采用独立于语言的文本格式
  • 通常用于在客户端和服务器之间传递数据

JSON的优点

  • 轻量级交互语言
  • 结构简单
  • 易于解析

定义JSON对象

var JSON对象 = { “name” : value, “name” : value, …… };

var person = { "name" : "张三",   "age" : 30,  "spouse" : null };

定义JSON数组

var JSON数组 = [ value, value, …… ];

var countryArray = [ "中国",  "美国",  "俄罗斯" ];
var personArray = [ { "name":"张三",  "age":30 },{ "name":"李四",  "age":40 } ];

JSON使用综合案例

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册</title>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	//1、定义JSON格式的user对象，并在div中输出
	var user = {
		"id" : 1,
		"name" : "张三",
		"pwd" : "000"
	};
	$("#objectDiv").append("ID：" + user.id + "<br>")
	               .append("用户名：" + user.name + "<br>")
	               .append("密码：" + user.pwd + "<br>");
	//2、定义JSON格式的字符串数组，并在ul和select中输出
	var ary = [ "中", "美", "俄" ];
	var $ary = $(ary);
	var $ul = $("#arrayUl"); // 展示数据的ul元素
	var $sel = $("#arraySel"); // 展示数据的select元素
	$ary.each(function() { $ul.append("<li>"+this+"</li>"); });
	$ary.each(function(i) {
	   $sel.append("<option value='"+(i+1)+"'>"+this+"</option>");
    });
	//3、定义JSON格式的user对象数组，并使用<table>输出
	var userArray = [ {
		"id" : 2,
		"name" : "admin",
		"pwd" : "123"
	}, {
		"id" : 3,
		"name" : "詹姆斯",
		"pwd" : "11111"
	}, {
		"id" : 4,
		"name" : "梅西",
		"pwd" : "6666"
	} ];
	var $table = $("<table border='1'></table>").append(
	       "<tr><td>ID</td><td>用户名</td><td>密码</td></tr>");
	$(userArray).each(function() {
	   $table.append("<tr><td>" + this.id + "</td><td>"
                    + this.name + "</td><td>"
                    + this.pwd + "</td></tr>");
	});
	$("#objectArrayDiv").append($table);

});
</script>
</head>
<body>
一、JSON格式的user对象:<div id="objectDiv"></div><br>
二、JSON格式的字符串数组:&nbsp;&nbsp;<select id="arraySel"></select>
<ul id="arrayUl"></ul>
三、JSON格式的user对象数组:<div id="objectArrayDiv"></div>
</body>
</html>

在Ajax中使用JSON数据格式

jQuery(document).ready(function($) {
	function initNews() {//使用Ajax技术获取新闻列表数据
		$.ajax({
			"url"		: "../util/news",
			"type"		: "GET",
			"data"		: "opr=list",
			"dataType"	: "json",
			"success"	: processNewsList
		});
	}
	function processNewsList(data) {//展示新闻列表
		var $newsList = $("#opt_area>ul");
		for (var i = 0; i < data.length;) {
			$newsList.append("<li>" + data[i].ntitle + "<span> 作者："
				+ data[i].nauthor + " &#160;&#160;&#160;&#160; "
				+ "<a href='#'>修改</a> &#160;&#160;&#160;&#160; "
				+ "<a href='#' οnclick='return clickdel()'>删除</a>" 
				+ "</span></li>");
			if ((++i) % 5 == 0) {
				$newsList.append("<li class='space'></li>");
			}
		}
	}
	initNews();//执行新闻列表初始化工作
});

后台servlet代码：

List<News> list = newsService.findAllNews();
News news = null;
StringBuffer newsJSON = new StringBuffer("[");
for (int i = 0;;) {
	news = list.get(i);
  newsJSON.append("{\"nid\":" + news.getNid() + ",");
  newsJSON.append("\"ntitle\":\""
      + news.getNtitle().replace("\"", "&quot;") + "\",");
  newsJSON.append("\"nauthor\":\""
      + news.getNauthor().replace("\"", "&quot;") + "\"}");
  if ((++i) == list.size()) {
      break;
  } else {
      newsJSON.append(",");
  }
}
newsJSON.append("]");
out.print(newsJSON);
out.flush();
out.close();

FastJSON

  • 随着JSON的广泛使用，在服务器端生成JSON字符串成了一件麻烦的工作，效率低且易出错
  • FastJSON:一个性能很好的、Java实现的JSON解析器和生成器
    • 将Java对象序列化成JSON字符串
    • 将JSON字符串反序列化得到Java对象
  • 官网：https://github.com/alibaba/fastjson/releases

入口类：com.alibaba.fastjson.JSON

方 法说 明
public static String toJSONString ( Object object )将Java对象序列化成JSON字符串
public static String toJSONString (Object object, boolean prettyFormat )prettyFormat为true时生成带格式的JSON字符串
public static String toJSONString ( Object object, SerializerFeature… features )可以通过参数features指定更多序列化规则
public static String toJSONStringWithDateFormat (Object object, String dateFormat, SerializerFeature… features )可以通过参数dateFormat指定日期类型的输出格式

枚举类型 SerializerFeature 定义了多种序列化属性

枚 举 值说 明
QuoteFieldNames为字段名加双引号，默认即使用
WriteMapNullValue输出值为null的字段，默认不输出
WriteNullListAsEmpty将值为null的List字段输出为[ ]
WriteNullStringAsEmpty将值为null的String字段输出为“”
WriteNullNumberAsZero将值为null的数值字段输出为0
WriteNullBooleanAsFalse将值为null的Boolean字段输出为false
SkipTransientField忽略transient字段，默认即忽略
PrettyFormat格式化JSON字符串，默认不格式化
// 包含值为 null 的字段，数值为 null  输出0，String 为 null 输出“”
String  strJSON = JSON.toJSONString ( javaObject,
                                     SerializerFeature.WriteMapNullValue,
                                     SerializerFeature.WriteNullNumberAsZero,
                                     SerializerFeature.WriteNullStringAsEmpty );

代码示例

List<News> list = newsService.findAllNews();
String newsJSON = JSON.toJSONStringWithDateFormat(list,
out.print(newsJSON);
out.flush();
out.close();

基于表单数据的Ajax请求

  • 需要发送表单数据时，提取表单元素的值并构造成合适的数据格式是件很烦琐的事。
  • 使用jQuery提供的方法简化处理
    • .serializeArray()
    • $.param()

.serializeArray()

检测一组表单元素中的有效控件

  • 没有被禁用
  • 必须有name属性
  • 选中的checkbox或radio
  • 触发提交事件的submit按钮
  • file元素不会被序列化

将有效控件序列化为JSON对象数组

  • 包含name和value两个属性

$.param()

将由. serializeArray()生成的对象数组序列化成请求字符串的形式
在这里插入图片描述

jQuery还提供了.serialize()方法。.serialize()内部使用$.param()对.serializeArray()做了一个简单包装。不需要中间环节时，可以更简便地完成表单数据的序列化

代码示例

jQuery(document).ready(function($) {
	function initNews() {//使用Ajax技术获取新闻列表数据
		$.getJSON("../util/news", "opr=list", processNewsList);
	}
	function processNewsList(data) {//展示新闻列表
		var $newsList = $("#opt_area>ul").empty();
		for (var i = 0; i < data.length;) {
			$newsList.append("<li>" + data[i].ntitle + "<span> 作者："
					+ data[i].nauthor + " &#160;&#160;&#160;&#160; "
					+ "<a href='#'>修改</a> &#160;&#160;&#160;&#160; "
					+ "<a href='#' οnclick='return clickdel()'>删除</a>" 
					+ "</span></li>");
			if ((++i) % 5 == 0) {
				$newsList.append("<li class='space'></li>");
			}
		}
	}
	/*
	function initNews() {//使用Ajax技术获取新闻列表数据
		$("#opt_area>ul").load("../util/news", "opr=listHtml");
	}
	*/
	initNews();//执行新闻列表初始化工作
	function initTopics() {//使用Ajax技术获取主题列表数据
		$.getJSON("../util/topics", "opr=list", processTopicsList);
	}
	function processTopicsList(data) {//展示主题列表
		var $topicsList = $("#opt_area>ul").empty();
		for (var i = 0; i < data.length; ++i) {
			$topicsList.append("<li> &#160;&#160;&#160;&#160; "
					+ data[i].tname + " &#160;&#160;&#160;&#160; "
					+ "<a href='../newspages/topic_modify.jsp?tid="
					+ data[i].tid + "&tname=" + data[i].tname + "'>修改</a>"
					+ " &#160;&#160;&#160;&#160; <a href='../util/topics?opr=del&tid="
					+ data[i].tid + "'>删除</a> </li>");
		}
	}
	/*
	function initTopics() {//使用Ajax技术获取主题列表数据
		$("#opt_area>ul").load("../util/topics", "opr=listHtml");
	}
	*/
	var $leftLinks = $("#opt_list a"); // 获取页面左侧功能链接
	$leftLinks.eq(3).click(initTopics);
	$leftLinks.eq(1).click(initNews);
});
苏生Susheng
关注
  • 6
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
13_JavaWeb——AJAX配套资源
05-02
此资源与我的博客13_JavaWeb——AJAX中的两个案例对应，其中Demo5使用AJAX异步处理页面实现对用户输入的实时校验，Demo6使用Axios+JSON完成对品牌列表的展示和添加，取代了先前的JSP。希望有所帮助
java处理ajax异步请求_JavaWeb笔记——ajax异步请求
weixin_36350067的博客
02-25 457
1. ajax是什么?* asynchronous javascript and xml：异步的js和xml* 它能使用js访问服务器，而且是异步访问* 服务器给客户端的响应一般是整个页面，一个html完整页面！但在ajax中因为是局部刷新，那么服务器就不用再响应整个页面！而只是数据> text：纯文本> xml：大家都熟悉> json：它是js提供的数据交互格式，它在ajax中...
JavaWeb自我学习——AJAX&&Axios异步框架
一名不想学习的未来程序猿。
05-20 543
AJAX 概念: AJAX(Asynchronous JavaScript And XML):异步的JavaScript和XML AJAX作用:1．与服务器进行数据交换:通过AJAX可以给服务器发送请求，并获取服务器响应的数据. 使用了AJAX和服务器进行通信，就可以使用HTML+AJAX来替换JSP页面了 2．异步交互:可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如:搜索联想、用户名是否可用校验，等等... 同步和异步的区别 同步：同步...
JavaWeb笔记——ajax异步请求
chuanke1344的博客
09-12 585
1. ajax是什么? * asynchronous javascript and xml：异步的js和xml * 它能使用js访问服务器，而且是异步访问 * 服务器给客户端的响应一般是整个页面，一个html完整页面！但在ajax中...
JavaWeb学习——Ajax
weixin_45890771的博客
04-05 891
目录 一、AJAX请求 二、原生AJAX请求的示例 三、jQuery 中的 AJAX 请求 一、AJAX请求 AJAX 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发 技术。 ajax 是一种浏览器通过 js 异步发起请求，局部更新页面的技术。 Ajax 请求的局部更新，浏览器地址栏不会发生变化 局部更新不会舍弃原来页面的内容 二、原生AJAX请求的示例 <!DOCTYPE ht
JavaWeb综合案例——品牌后台管理系统
08-12
最新版JavaWeb综合案例——品牌后台管理系统 来源：改编自黑马程序员最新JavaWeb课程案例 所用技术及工具：Mybatis+Maven+Filter+Ajax+JSON+JavaScript+HTML+CSS+Element+VUE
javaWeb训练专用——软件项目信息管理
04-14
javaWeb训练专用——软件项目信息管理 难度系数3个星，相较于之前的2个星，稍微难了一些
JavaWeb ajax异步自动填充信息
06-05
ajax异步自动填充信息，类似于百度查询的简单demo，希望能帮到大家
javaweb大作业——简单的学生成绩管理系统
10-21
一个简单的javaweb大作业，简单又不失水准，比较容易看懂，另附数据库语句，以及实验报告流程图等
AJAX&Vue
m0_69266818的博客
04-27 1011
详细介绍了vue，axios，es6，json
前端获取资源的方式(ajax、fetch)及其区别
qq_39454432的博客
04-24 1405
前端获取资源的方式(ajax、fetch)及其区别
判断前端入参是否空否则提示前端写法
最新发布
qq_39306234的博客
04-28 229
前端先声明一个变量，用于alert判断。在templeat中定义一个提示语句。然后在点击事件时判断一下是否展示。
vue实现录音并转文字功能，包括PC端web，手机端web
byebukesi的博客
04-26 514
不止vue，不限技术栈，vue2、vue3、react、.net以及原生js均可实现。
2024 XYCTF Web 方向 wp 全解
qq_39947980的博客
04-27 977
XYCTF 2024 Web 方向全解
两个前端标签
ma_no_lo的博客
04-24 172
两个前端标签
前端Vue2项目搭建过程
xuemen11的博客
04-25 1212
vue2,vuex,vant组件库
docker部署前端项目（二）遇到的问题
weixin_45379180的博客
04-25 396
原因： 安装docker的时候使用的是 yum -y install docker 命令，这个命令安装的是老版本。报错四：conflicts with file from package docker-common。因为使用 sudo yum install docker （下载到的是旧版）missing signature key 缺少秘钥。yum remove docker 删除docker。1、docker版本号 只有1.13.1。解决：可能是docker 未启用。
vue组件render函数中作用域插槽使用方式
nicecode
04-24 308
父组件使用render函数写的,子组件的书写方式随意,想在父组件中使用子组件时写一个作用域插槽.
JavaWeb综合实验——CRUD的实验目的
06-12
JavaWeb综合实验——CRUD的实验目的主要有以下几个方面： 1. 培养学生的Web开发能力：通过实验，让学生掌握Web开发的基本知识和技能，如HTML、CSS、JavaScript等。 2. 培养学生的Servlet和JSP编程能力：通过实验，让学生掌握Servlet和JSP的基本用法和编程技能，如请求和响应、会话管理、数据传递等。 3. 培养学生的数据库操作能力：通过实验，让学生掌握数据库的基本概念和操作技能，如创建表、增删改查等。 4. 培养学生的实际应用能力：通过实验，让学生学会将所学的知识应用于实际项目中，提高学生的实际应用能力。 5. 培养学生的团队协作精神：通过实验，让学生学会与同学一起协作完成项目，培养学生的团队协作精神。 6. 增强学生的代码编写能力：通过实验，让学生学会编写高质量、可维护性强的代码，提高学生的代码编写能力。

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值