day76 jquery

知识点:
    1 在HTML中引入jQuery
    2 jQuery中就绪函数
    3 jQuery中选择器
    4 使用jQuery获取表单元素的值 及标签中间的内容
    5 jQuery中获取标签属性
    6 jQuery设置和获取标签样式
-----------------------------------

一  在HTML中引入jQuery

        

                

1


    1) 把jQuery.js文件添加到项目的js目录
    2) 在html页面使用<script>引入jQuery.js
        <script src="js/jQuery.js"></script>
     注意: 先引入jQuery.js然后再引入自己的js文件


二  jQuery中就绪函数


     1)  语法
        $(documnet).ready(function(){
            jQuery代码
        })
    2) 简化版
        $(function(){
            jQuery代码
        })
    3) jQuery代码的语法
        
    3.1) 标签对象的事件
        $("选择器").事件名(function(){})
        注意: 事件名 没有on  
                js : onclick  -->jQuery click()


三  jQuery中选择器


四 获取和设置标签的属性信息


    1) attr()
        获取属性值 : 标签对象.attr("属性名")
        设置属性值 :标签对象.attr("属性名",值)
        同时设置多个属性:  标签对象.attr({"属性名":值,"属性名":值})
    2) prop()
        获取属性值 : 标签对象.prop("属性名")
        设置属性值 :标签对象.prop("属性名",值)
        同时设置多个属性:  标签对象.prop({"属性名":值,"属性名":值})
     注意:
        使用prop获取或设置checked,disabled,selected,readonly属性时,值为true或false

                                                                                                                                                                                 几个复选框和全选框网页


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="css/top.css">
		<link rel="stylesheet" href="css/style.css">
		<link rel="stylesheet" href="css/goods.css">
			<!-- <script src="js/checkBox.js"></script> -->
			<script src="js/jquery-3.5.1.min.js"></script>
			<script src="js/jqueryGoods.js"></script>
	</head>
	<body>
		<div id ="div_content">
		<iframe src="top.html" frameborder="0" id="iframe_top" scrolling="no"></iframe>
		<div id = "div_content_table">
			<table>
				<tr>
					<th class="goodsImg"><input  type = "checkbox" id="boxOne"  />全选</th>
					<th >商品图片</th>
					<th>商品名称/出售者/联系方式</th>
					<th>价格</th>
				</tr>
				<tr>
					<td>
						<input  type = "checkbox" name="box" />
					</td>
					<td>
							<img src="img/list1.jpg"/>
					</td>
					<td>杜比环绕,家庭影院必备,超真实享受
						<br />
						出售者:ling112233
						<br />
						<img src="img/1.gif"/><img src="img/2.gif"/>
					</td>
					<td>一口价:
						<br />
						2000.0
					</td>
				</tr>
				<tr>
					<td>
						<input  type = "checkbox" name="box" />
					</td>
					<td>
							<img src="img/list2.jpg"/>
					</td>
					<td>杜比环绕,家庭影院必备,超真实享受
						<br />
						出售者:ling112233
						<br />
						<img src="img/1.gif"/><img src="img/2.gif"/>
					</td>
					<td>一口价:
						<br />
						2000.0
					</td>
				</tr>
				<tr>
					<td>
						<input  type = "checkbox" name="box" />
					</td>
					<td>
							<img src="img/list3.jpg"/>
					</td>
					<td>杜比环绕,家庭影院必备,超真实享受
						<br />
						出售者:ling112233
						<br />
						<img src="img/1.gif"/><img src="img/2.gif"/>
					</td>
					<td>一口价:
						<br />
						2000.0
					</td>
				</tr>
				<tr>
					<td>
						<input  type = "checkbox" name="box"/>
					</td>
					<td>
							<img src="img/list4.jpg"/>
					</td>
					<td>杜比环绕,家庭影院必备,超真实享受
						<br />
						出售者:ling112233
						<br />
						<img src="img/1.gif"/><img src="img/2.gif"/>
					</td>
					<td>一口价:
						<br />
						2000.0
					</td>
				</tr>
			</table>
		</div>
		<iframe src="bottom.html" frameborder="0" id="iframe_bottom" scrolling="no"></iframe>
		</div>
		
	
	</body>
</html>

                                         效果图

                                    实现全选功能(包括全选及取消全选)checkBox.js代码

function checkBox(){
	let isOkAll = document.getElementById("boxOne").checked;
	
	let isOkBox  = document.getElementsByName("box");
	
	for (let s of isOkBox) {
		s.checked = isOkAll;
	}
}

function checkBoxOne(){
	let isOkBox = document.getElementsByName("box");
	
	let isOkAll = document.getElementById("boxOne");

	
	for(let s of isOkBox){
		if(!s.checked){
			isOkAll.checked = s.checked;
			return;
		}
			
	}
	isOkAll.checked = true;
}

                                 实现全选功能(包括全选及取消全选) 的jquery代码

$(document).ready(function(){
				$("#boxOne").click(function(){
				let isOk = $(this).prop("checked");
				console.log(isOk)
				$("[name='box']").prop("checked",isOk)
				})
				
				
				$("[name='box']").click(function(){
					let len = $("[name='box']").length;
					console.log(len)
					let checkedLen = $("[name='box']:checked").length;
					console.log(checkedLen)
					$("#boxOne").prop("checked",len == checkedLen)
				})
				
				
			})


五 添加和删除标签的样式


    1 类样式
        1) addClass("类样式名1 类样式名2 ... ") 添加类样式
        2) removeClass()
            removeClass("类样式名") :移除指定的类样式
            removeClass() :移除所有类样式
    2 通过 css() 设置样式
            css("样式属性名",值)
            css({"样式属性名":值,"样式属性名":值})
六  获取表单元素的value值 ,标签中间内容
    1 表单元素的value值
        赋值:  表单元素对象.val("值");
        取值:  表单元素对象.val();
    2 标签中间内容
            js    :innerHTML ,innerText
            jQuery:  html()
                    text()

                                     注册网页

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>当当网注册页面</title>
    <link href="css/global.css" rel="stylesheet" type="text/css" />
    <link href="css/layout.css" rel="stylesheet" type="text/css" />
	<!-- <script src="js/注册.js"></script> -->
	<script src="js/jquery-3.5.1.min.js"></script>
	<script src="js/注册jquery.js"></script>
</head>

<body>
<div id="header">
    <div id="register_header">
        <div class="register_header_left"><img src="images/logo.gif" alt="logo"></div>
        <div class="register_header_right"><a href="index.html" class="blue">首页</a> | <a href="product.html" class="blue">商品展示页</a>  | <a href="shopping.html" class="blue">购物车</a> |  <a href="login.html" class="blue">登录</a></div>
    </div>
</div>
<div id="main">
    <div class="register_content">
        <div class="register_top_bg"></div>
        <div class="register_mid_bg">
            <ul>
                <li class="register_mid_left">填写注册信息</li>
                <li class="register_mid_mid">2. 邮箱验证</li>
                <li class="register_mid_right">3. 完成注册</li>
            </ul>
        </div>
        <div class="register_top_bg_mid">
            <div class="register_top_bg_two_left"></div>
            <div class="register_top_bg_two_right"></div>
            <div class="register_title_bg"><img src="images/register_pic_02.gif" alt="欢迎注册"><br>您所提供的资料不会做其他用途,敬请安心填写。</div>
        </div>
        <div class="register_dotted_bg"></div>
        <div class="register_message">
            <form action="" method="post" id="myform">
                <dl class="register_row">
                    <dt>Email地址:</dt>
                    <dd><input id="email" type="text" class="register_input"></dd>
                    <dd><div id="email_prompt"	 ></div></dd>

                <dl class="register_row">
                    <dt>设置昵称:</dt>
                    <dd><input id="nickName" type="text" class="register_input"></dd>
                    <dd><div id="nickName_prompt"></div></dd>
                </dl>
                <dl class="register_row">
                    <dt>设定密码:</dt>
                    <dd><input id="pwd" type="password" class="register_input"></dd>
                    <dd><div id="pwd_prompt"></div></dd>
                </dl>
                <dl class="register_row">
                    <dt>再输入一次密码:</dt>
                    <dd><input id="repwd" type="password" class="register_input"></dd>
                    <dd><div id="repwd_prompt"></div></dd>
                </dl>
                <dl class="register_row">
                    <dt>性别:</dt>
                    <dd><input name="sex" id="man" type="radio" value="男" checked="checked"> <label for="man">男</label></dd>
                    <dd> <input name="sex" id="woman" type="radio" value="女"> <label for="woman">女</label></dd>
                </dl>
                <dl class="register_row">
                    <dt>所在地区:</dt>
                    <dd>
                        <select id="province" style="width:120px;" >
                            <option>请选择省/城市</option>
                        </select>
                    </dd>
                    <dd>
                        <select id="city"  style="width:130px;">
                            <option>请选择城市/地区</option>
                        </select>
                    </dd>
                </dl>
                <div class="registerBtn"><input id="registerBtn" type="image" src="images/register_btn_out.gif">
					<input type="button" id = "button123">
				</div>
            </form>
        </div>
    </div>
</div>
<!--网站版权部分开始-->
<div id="footer">
    <iframe src="footer.html" height="50px" width="900px" frameborder="0"></iframe>
</div>
</body>
</html>

                                                        注册js文件



	let classDl = document.getElementsByClassName("register_row")
function checkemail(){
	let email = classDl.getElementsById("email").value
	let emailInner = classDl.getElementsById("email_prompt")
	
	if(email == ""){
		emailInner.innerHTML = "邮箱为空"
		emailInner.style.color = "red"
		return false;
	}
	
	let reg = /[@][.]{1}/
	if(!reg.test(email)){
		emailInner.innerHTML = "邮箱包含一个@ 后面一个."
		emailInner.style.color = "red"
		return false;
	}
	
	emailInner.innerHTML = "✔"
	emailInner.style.color = "green"
	return true;
}
function checkNickName(){
	let name = classDl.getElementsById("nickName").value
	let nameInner = classDl.getElementsById("nickName_prompt")
	
	if( name == ""){
		 nameInner.innerHTML = "邮箱为空"
		 nameInner.style.color = "red"
		return false;
	}
	
	
	let reg = /^[0-9][A-z_]{5,12}/
	if(!reg.test(name)){
		nameInner.innerHTML = "开头不能为数字,长度6到13位"
		nameInner.style.color = "red"
		return false;
	}
	
	nameInner.innerHTML = "✔"
	nameInner.style.color = "green"
	return true;
}

function checkPwd(){
	let password = classDl.getElementsById("pwd").value
	let passwordInner = classDl.getElementsById("pwd_prompt")
	
	let(password == ""){
		passwordInner.innerHTML = "密码为空"
		passwordInner.style.color = "red"
		return false;
	}
	
	let reg =/[/w]{8,16}/
	if{
		passwordInner.innerHTML = "只能包含数字字母下划线"
		passwordInner.style.color = "red"
		return false;
	}
	
	passwordInner.innerHTML = "✔"
	passwordInner.style.color = "green"
	return true;
}

function checkPwd(){
	let password = classDl.getElementsById("pwd").value
	let repassword = classDl.getElementsById("repwd").value
	let repasswordInner = classDl.getElementsById("repwd_prompt")
	
	let(password == ""){
		repasswordInner.innerHTML = "密码为空"
		repasswordInner.style.color = "red"
		return false;
	}
	
	if(!password === repassword){
		passwordInner.innerHTML = "密码错误"
		passwordInner.style.color = "red"
		return false;
	}
	
	passwordInner.innerHTML = "✔"
	passwordInner.style.color = "green"
	return true;
}



let pros = new Array();
	pros["湖北省"] = ["襄阳市","宜昌市","武汉市"]
	pros["北京市"] = ["东城区","西城区","海淀区"]
function addPro(){
	let pro = document.getElementById("province");
	for (let s in pros) {
		let op = new Option(s,s);
		pro.add(op,null);
	}
}
	window.onload = addPro;
	
function addCity(){
	let city = document.getElementById("city")
	city.options.length = 1
	let pro = document.getElementById("province").value
	for (let s of pros[pro]) {
		let op = new Option(s,s);
		city.add(op,null)
	}
}
	

                                        注册jquery文件

$(function(){
	addPro()
	$("#province").change(function(){
		addCity()
	})
	
		let isEmail = false
	$("#email").blur(function(){
		let email =	$(this).val()
		let emailPrompt = $("#email_prompt")
		if(email == ""){
			emailPrompt.html("邮箱不能为空!")
			emailPrompt.removeClass().addClass("register_prompt_error")
			isEmail = false
			return;
		}
		let reg =/^\w{5,10}@[a-z\d]{2,10}[.][a-z]{2,4}$/i;
		if(!reg.test(email)){
			emailPrompt.html("格式有误")
			emailPrompt.removeClass().addClass("register_prompt_error")
			isEmail = false
			return;
		}
		emailPrompt.html("")
		emailPrompt.removeClass().addClass("register_prompt_ok")
		isEmail = true;
	})
		
		let isNickName =false
		$("#nickName").blur(function(){
			let nickName = $(this).val()
			let nickNamePro = $("#nickName_prompt")
			
			if(nickName == ""){
				nickNamePro.html("不能为空")
				nickNamePro.removeClass().addClass("register_prompt_error")
				isNickName = false;
				return
			}
			let reg = /[\w]{2,10}/
			if(!reg.test(nickName)){
				nickNamePro.html("错误格式")
				nickNamePro.removeClass().addClass("register_prompt_error")
				isNickName = false;
				return
			}
			nickNamePro.html("")
			nickNamePro.removeClass().addClass("register_prompt_ok")
			isNickName = true
			
		})
		
		let isPwd = false
		$("#pwd").blur(function(){
			let pwd = $(this).val()
			let pwdPro = $("#pwd_prompt")
			
			if(pwd == ""){
				pwdPro.html("不能为空")
				pwdPro.removeClass().addClass("register_prompt_error")
				isPwd = false
				return
			}
			
			let reg = /[\w]{6,20}/
			if(!reg.test(pwd)){
				pwdPro.html("格式错误")
				pwdPro.removeClass().addClass("register_prompt_error")
				isPwd = false
				return
			}
			pwdPro.html("")
			pwdPro.removeClass().addClass("register_prompt_ok")
			isPwd = true
			
		})
		let isrepwd = false
		$("#repwd").blur(function(){
				let repwd = $(this).val()
				let pwd = $("#pwd").val()
				let repwdPro = $("#repwd_prompt")
				
				if(repwd == ""){
					repwdPro.html("不能为空")
					repwdPro.removeClass().addClass("register_prompt_error")
					isrePwd = false
					return
				}
				if(repwd != pwd){
					repwdPro.html("密码不一致")
					repwdPro.removeClass().addClass("register_prompt_error")
					isrePwd = false
					return
				}
				repwdPro.html("")
				repwdPro.removeClass().addClass("register_prompt_ok")
				isrepwd = true
			
			})
			
			$("#myform").submit(function(){
				$(".register_input").trigger("blur")
				return isEmail&&isNickName&&isPwd&&isepwd
			})
			
			$("#button123").click(function (){
				$(".register_input").trigger("blur")
				if(isEmail&&isNickName&&isPwd&&isrepwd){
					$("#myform").submit();
				}
			})
}) 

let pros = new Array();
	pros["湖北省"] = ["襄阳市","宜昌市","武汉市"]
	pros["北京市"] = ["东城区","西城区","海淀区"]
	
	function addPro(){
		for (let s in pros) {
			$("<option>",{
				text:s,
				val:s
			}).appendTo("#province")
		}
	
		
	}	
	function addCity(){
		let pro = $("#province").val()
		
		$("#city option:not(:first-of-type)").remove()
		
		for (let s of pros[pro]) {
			$("<option>",{
				text:s,
				val:s
			}).appendTo("#city")
		}
		
	}	


七 内添加


    1) append(content|fn)
        appendTo(content)
        示例:把B添加到A内部结尾处
        A.append(B)
        B.apppendTo(A)
    2) prepend(content|fn)
        prependTo(content)

let pros = new Array();
    pros["湖北省"] = ["襄阳市","宜昌市","武汉市"]
    pros["北京市"] = ["东城区","西城区","海淀区"]
    
    function addPro(){
        for (let s in pros) {
            $("<option>",{
                text:s,
                val:s
            }).appendTo("#province")
        }       
    }    


八 : 创建jQuery对象


    1 语法:
      $("<标签名>",{
          属性名:值,
          属性名:值
          ....
      })

let pros = new Array();
    pros["湖北省"] = ["襄阳市","宜昌市","武汉市"]
    pros["北京市"] = ["东城区","西城区","海淀区"]
    
    function addPro(){
        for (let s in pros) {
            $("<option>",{
                text:s,
                val:s
            })
.appendTo("#province")
        }
    }    

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

工作这么久,你有测试思维了吗?

在如今竞争激烈的职场中&#xff0c;拥有测试思维已成为一个不可或缺的技能。无论你是从事软件开发、项目管理还是市场营销等各行各业&#xff0c;测试思维都能够帮助你更好地解决问题、提高工作效率以及保障质量。然而&#xff0c;工作时间的长短并不代表一个人是否具备测试思…

python ConfigParser:Python 标准库,ini 文件解析器

大家好&#xff01;在进行接口自动化工作时&#xff0c;配置文件是非常常见和重要的一部分。Python 提供了一个强大的标准库——ConfigParser&#xff0c;用于解析和处理 INI 文件。在本文中&#xff0c;我们将介绍如何使用 ConfigParser 来读取和操作 INI 文件&#xff0c;并提…

【Linux进阶之路】ARP欺骗实验

正文 话不多说&#xff0c;直接干&#xff01; 首先我们需要准备一下环境&#xff0c;先配置VMARE&#xff0c;然后下载KALI的虚拟机。 详细的安装教程视频&#xff1a;点击跳转&#xff0c;下载KALI可能要半个小时&#xff0c;中间可以看个剧玩个游戏缓一缓。 配置好之后&am…

ArcGIS和ArcGIS Pro快速加载ArcGIS历史影像World Imagery Wayback

ArcGIS在线历史影像网站 World Imagery Wayback(网址:https://livingatlas.arcgis.com/wayback/)提供了数期历史影像在线浏览服务,之前不少自媒体作者在文中宣称其能代表Google Earth历史影像。 1、一点对比 (1)同一级别下的版本覆盖面 以下述区域为例,自2014年2月20…

提升自媒体写作效率:7款必备工具推荐! #知识分享#媒体#AI写作

我们做自媒体运营&#xff0c;想要快速的创作内容&#xff0c;提供文章的创作速度是我们的目标&#xff0c;我们别的大佬可以很快地就创作出一篇内容&#xff0c;而自己墨迹半天确出不了一个字呢&#xff1f;其实这关乎到创作技巧&#xff0c;下面小编就跟大家分享如何利用自媒…

OneFlow深度学习框架:技术优势与功能特点

文章目录 一、概要二、核心技术优势2.1、分布式训练2.2、极致性能2.3、端到端的智能数据平台2.4、开放灵活的算法支持2.5、跨平台支持 三、功能特点四、OneFlow与TensorFlow对比四、安装OneFlow五、总结 一、概要 OneFlow是一款基于Python的开源深度学习框架&#xff0c;旨在实…

简介有向无环图DAG

Sui创纪录的每秒交易量部分归功于数学构造&#xff0c;即有向无环图&#xff08;Directed Acyclic Graph&#xff0c;DAG&#xff09;&#xff0c;该构造通过以最高效的方式处理交易来加速网络交易&#xff0c;而不是按照先来先服务的线性进展。 区块链是设计用于确保数据完整…

【简单讲解下Lisp的学习历程】

&#x1f3a5;博主&#xff1a;程序员不想YY啊 &#x1f4ab;CSDN优质创作者&#xff0c;CSDN实力新星&#xff0c;CSDN博客专家 &#x1f917;点赞&#x1f388;收藏⭐再看&#x1f4ab;养成习惯 ✨希望本文对您有所裨益&#xff0c;如有不足之处&#xff0c;欢迎在评论区提出…

模型融合的方法

集成学习&#xff1a;通过构建并结合多个学习器来完成学习任务&#xff0c;有时也被称为多分类器系统、基于委员会的学习等。&#xff08;集成学习不是只有同质学习器的集成&#xff0c;还有异质学习器的集成&#xff09; 模型融合&#xff1a;通过多个模型共同决策提升任务的…

代码随想录学习Day 25

491.递增子序列 题目链接 讲解链接 本题的是求自增子序列&#xff0c;所以不能对原数组进行排序&#xff0c;排完序的数组都是自增子序列了&#xff0c;所以不能使用之前的去重逻辑&#xff01;如果仍旧使用之前的逻辑&#xff0c;那么当遇到数组为{4&#xff0c;7&#xff…

思迈特软件与上海德拓签署战略合作协议,携手赋能企业数字化转型

3月27日&#xff0c;广州思迈特软件有限公司&#xff08;简称“思迈特软件”&#xff09;与上海德拓信息技术有限公司&#xff08;简称“德拓信息”&#xff09;正式签约建立战略合作伙伴关系。双方将在数字化转型、数据服务、数据应用以及市场资源等多个领域展开深度合作&…

2024年贵州省职业院校技能大赛云计算应用赛项赛题第2套

#需要资源&#xff08;软件包及镜像&#xff09;或有问题的&#xff0c;可私聊博主&#xff01;&#xff01;&#xff01; #需要资源&#xff08;软件包及镜像&#xff09;或有问题的&#xff0c;可私聊博主&#xff01;&#xff01;&#xff01; #需要资源&#xff08;软件包…

xilinx AXI CAN驱动开发

CAN收发方案有很多&#xff0c;常见的解决方案通过是采用CAN收发芯片&#xff0c;例如最常用的SJA1000,xilinx直接将CAN协议栈用纯逻辑实现&#xff0c;AXI CAN是其中一种&#xff1b; 通过这种方式硬件上只需外接一个PHY芯片即可 上图加了一个电平转换芯片 软件设计方面&…

【Labview】虚拟仪器技术

一、背景知识 1.1 虚拟仪器的定义、组成和应用 虚拟仪器的特点 虚拟仪器的突出特征为“硬件功能软件化”&#xff0c;虚拟仪器是在计算机上显示仪器面板&#xff0c;将硬件电路完成信号调理和处理功能由计算机程序完成。 虚拟仪器的组成 硬件软件 硬件是基础&#xff0c;负责将…

提取COCO数据集中特定的类—vehicle 4类

提取COCO数据集中特定的类—vehicle 4类 1 安装pycocotools2 下载COCO数据集3 提取特定的类别4 多类标签合并 1 安装pycocotools pycocotools github地址 pip install githttps://github.com/philferriere/cocoapi.git#subdirectoryPythonAPI2 下载COCO数据集 COCO官网下载2…

Java中的Stream流常用接口和方法

​TOC 第一章&#xff1a;Stream流是什么 1.1&#xff09;简单介绍 学习Stream流就绕不开Lambda表达式&#xff0c; 需要了解Lambda表达式可以看一下这篇–>&#xff1a;Lambda表达式学习 1.其实“流”是个抽象概念&#xff0c;我们把现实世界中与Stream流有相同特性的…

破解极域电子教室控屏

以管理员身份运行cmd 输入代码

CentOS7安装Docker及禅道

https://blog.csdn.net/weixin_46453070/article/details/136183615?ops_request_misc%257B%2522request%255Fid%2522%253A%2522171246925816800222886233%2522%252C%2522scm%2522%253A%252220140713.130102334…%2522%257D&request_id171246925816800222886233&biz_i…

C++ //练习 11.22 给定一个map<string, vector<int>>,对此容器的插入一个元素的insert版本,写出其参数类型和返回类型。

C Primer&#xff08;第5版&#xff09; 练习 11.22 练习 11.22 给定一个map<string, vector<int>>&#xff0c;对此容器的插入一个元素的insert版本&#xff0c;写出其参数类型和返回类型。 环境&#xff1a;Linux Ubuntu&#xff08;云服务器&#xff09; 工具…

图形化界面使用MQ!!!

一、docker安装 1、拉去镜像 docker pull rabbitmq:3.10-management 2、Docker运行&#xff0c;并设置开机自启动&#xff08;第一个-p是MQ默认配置的端口&#xff0c;第二个-p是图形化界面配置的端口&#xff09; docker run -d --restartalways --name rabbitmq -p 5672:5672…