纯div+css+js弹出窗
目的：实现弹出窗、仅关闭弹窗之后才能操作。自适应宽度与高度、当文本内容太多时、添加滚动条效果。
效果图
源码
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Popup Box</title><style>.popup {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);z-index: 9999;}.popup-content {background-color: #fff;width: 800px;height: 800px;margin: 100px auto;padding: 10px;border-radius: 5px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);}.close {color: #aaa;float: right;font-size: 28px;font-weight: bold;cursor: pointer;}/* 全局设置滚动条样式 */*::-webkit-scrollbar {width: 10px;background-color: #f5f5f5;}*::-webkit-scrollbar-thumb {background-color: #ccc;border-radius: 5px;}</style></head><body><button id="popupButton" onclick="openPopup()">Open Popup</button><div id="popup" class="popup"><div class="popup-content"><span class="close" onclick="closePopup()">×</span><h2>This is a Popup</h2> <div id="popup-div" class="popup-div"></div></div></div><script>const popup = document.getElementById("popup");const popupDiv = document.getElementById("popup-div");function openPopup() {popup.style.display = "block";document.getElementById("popup-div").innerHTML=
'<p><span class="text-huge">第一章1</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章2</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章3</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章4</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章5</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章6</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章7</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章8</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章9</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章10</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章11</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章12</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章</li></ul><p> </p>'+
'<p><span class="text-huge">第一章13</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章13</li></ul><p> </p>'+
'<p><span class="text-huge">第一章14</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章14</li></ul><p> </p>'+
'<p><span class="text-huge">第一章15</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章15</li></ul><p> </p>'+
'<p><span class="text-huge">第一章16</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章16</li></ul><p> </p>'+
'<p><span class="text-huge">第一章17</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章17</li></ul><p> </p>'+
'<p><span class="text-huge">第一章18</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章18</li></ul><p> </p>'+
'<p><span class="text-huge">第一章19</span></p><p><span class="text-big">第一章</span></p><p>第一章</p><p><span class="text-small">第一章</span></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><p><mark class="marker-yellow"><strong>第一章</strong></mark></p><ul><li style="margin-left:40px;">第一章</li><li style="margin-left:40px;">第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章</li><li style="margin-left:40px;">第一章第一章第一章第一章第一章第一章第一章第一章19</li></ul><p> </p>';popupDiv.style.cssText = "width:800px;height:500px;background-color:rgba(0, 0, 0, 0.5); overflow:scroll;";}function closePopup() {popup.style.display = "none";popupDiv.innerHTML='';popupDiv.style.cssText = "width:0px;height:0px;";}</script></body>
</html>
核心代码
1.父容器设置宽高（popup-content） 子容器（popup-div）设置滚动条支持
2.由于div内容是通过js动态设置、所以样式也需要动态设置
复制以上代码 HTML验证
相关文章：
纯div+css+js弹出窗
目的：实现弹出窗、仅关闭弹窗之后才能操作。自适应宽度与高度、当文本内容太多时、添加滚动条效果。 效果图 源码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewport"…...
一篇文章学会HTML
目录 页面结构 网页基本标签 图像标签 超链接标签 文本链接 图像链接 锚链接 功能链接 列表 有序列表 无序列表 自定义列表 表格 跨列/跨行 表头 媒体元素 视频 音频 网站的嵌套 表单 表单元素 文本框 单选框 多选框 按钮 下拉框 文本域和文件域 表…...
QGIS二次开发（插件开发）
实习二 QGIS插件开发 2.1 任务要求 a）用C语言编写qgis插件，实现带有x/y坐标的文本文件的地图显示。 用文件流fstream操作文本文件，读取其中的坐标数据。基于QgsPlugin相关类派生出一个插件，并加到插件工厂中。基于QgsVectorLaye…...
Web防火墙和下一代防火墙的区别
介绍 客户经常询问“当我已经拥有下一代防火墙（NGFW）时，为什么需要Web应用程序防火墙（WAF）？”。本博文的目的是解释两种解决方案之间的区别，重点关注Web应用程序防火墙可以提供的附加值。 什么…...
Linux：alias别名永久有效
一、背景 日常使用bash时候，有些常用的命令参数的组合命令太长，很难记，此时可以利用Linux提供的alias命令生成命令的别名（命令的隐射），但是我们会发现，当退出了终端后重新登录就失效了ÿ…...
【递归与回溯深度解析：经典题解精讲（中篇）】—— LeetCode
文章目录 组合目标和组合总和字母大小写全排序优美的排列N皇后 组合 思路：回溯算法 问题要求从 1 到 n 中选出 k 个数的所有组合。 使用回溯算法递归构造解。 每次递归时，记录当前的组合路径，当组合长度达到 k 时，将其加入结果集…...
01.HTTPS的实现原理-HTTPS的概念
01.HTTPS的实现原理-HTTPS的概念 简介1. HTTPS的概念和安全性2. HTTPS的实现原理3. HTTPS和HTTP的区别4. OSI七层协议模型5. SSL和TLS的区别 简介 该系列文章主要讲述了HTTPS协议与HTTP协议的区别，以及HTTPS如何实现安全传输。内容分为三部分：HTTPS的实…...
一文详解MacOS+CLion——构建libtorch机器学习开发环境
对于希望在本地环境中进行深度学习开发的开发者来说，配置合适的工具链是至关重要的一步。本文旨在帮助您在 macOS 操作系统上，利用 CLion IDE 和 PyTorch 的 C依赖库——libtorch，快速搭建起一个高效的开发环境。这里我们将一步步地讲解如何下…...
【LeetCode 面试经典150题】详细题解之哈希表篇
【LeetCode 面试经典150题】详细题解之哈希表篇 1 哈希表的基础1.1 基础概念及实现1.2.1 哈希表的工作原理1.2.2 705.设计哈希集合1.2.3 706.设计哈希映射 1.2 HashMap相关1.2.1 基本操作1.2.2 遍历 1.3 Hashtable1.4 LinkedHashMap1.5 HashSet**1.5.1基本特性**1.5.2 基本方法…...
linux socket编程之udp_dict_serve服务端--引入配置文件
注意：本篇博客只是对上一篇博客功能的增加 1.创建配置文件(翻译) Dict.txt apple: 苹果 banana: 香蕉 cat: 猫 dog: 狗 book: 书 pen: 笔 happy: 快乐的 sad: 悲伤的 run: 跑 jump: 跳 teacher: 老师 student: 学生 car: 汽车 bus: 公交车 love: 爱 hate: 恨 hell…...
selenium学习笔记（二）
文章目录 前言设计模式POMPOM概念POM优势POM设计原则POM的实现 selenium的常用操作处理动态元素截图操作勾选复选框多层框架/窗口定位操作下拉框上传文件操作处理弹窗切换窗口拖拽操作 如何处理浏览器驱动更新导致的问题selenium与网站监控监听网页内容变化监控网络请求 seleni…...
宏集eX710物联网工控屏在石油开采机械中的应用与优势
案例概况 客户：天津某石油机械公司 应用产品：宏集eX710物联网工控屏 应用场景：钻井平台设备控制系统 一、应用背景 石油开采和生产过程复杂，涵盖钻井平台、采油设备、压缩机、分离器、管道输送系统等多种机械设备。这些设备通…...
linux——vi命令常用操作
一、vi模式 vi一般分为三种模式，分别是命令行模式、插入模式、末行模式 1.命令模式：控制屏幕光标的移动，按 ：进入末行模式，按 i（其他插入命令也可） 进入插入模式； 2.插入模式&…...
vscode添加全局宏定义
利用vscode编辑代码时，设置了禁用非活动区域着色后，在一些编译脚本中配置的宏又识别不了 遇到#ifdef包住的代码就会变暗色，想查看代码不是很方便。如下图： 一 解决： 在vscode中添加全局宏定义。 二 步骤：…...
重装荣耀X14笔记本电脑踩坑记
这几天趁着有国补搞了台荣耀 X14笔记本电脑。到手后第一件事情对我来说当然是要重装成Windows 11 LTSC版。所以按以往的经验做了个USB启动安装盘，但发现上电后按F12能进入启动设备选择，可是USB分类下没有任何设备。重启按F2进入设置界面，关闭…...
Android `android.graphics.drawable` 包深度解析：架构与设计模式
Android android.graphics.drawable 包深度解析：架构与设计模式 目录 引言Drawable 概述Drawable 的架构 Drawable 类层次结构Drawable 的核心方法Drawable 的设计模式 装饰者模式工厂模式状态模式常用 Drawable 子类解析 BitmapDrawableShapeDrawableLayerDrawableStateList…...
Kotlin语言的软件工程
Kotlin语言的软件工程 引言 在现代软件开发中，选择合适的编程语言是项目成功的关键之一。随着移动互联网的迅猛发展，以及大数据和人工智能等新兴技术的崛起，Kotlin语言凭借其简洁、高效和安全等特性，迅速崛起为备受欢迎的编程语…...
面试经典 150 题——数组/字符串（一）
文章目录 1、合并两个有序数组1.1 题目链接1.2 题目描述1.3 解题代码1.4 解题思路 2、移除元素2.1 题目链接2.2 题目描述2.3 解题代码2.4 解题思路 3、删除有序数组中的重复项3.1 题目链接3.2 题目描述3.3 解题代码3.4 解题思路 4、删除有序数组中的重复项 II4.1 题目链接4.2 题…...
使用亚马逊针对 PyTorch 和 MinIO 的 S3 连接器实现可迭代式数据集
2023 年 11 月，Amazon 宣布推出适用于 PyTorch 的 S3 连接器。适用于 PyTorch 的 Amazon S3 连接器提供了专为 S3 对象存储构建的 PyTorch 数据集基元（数据集和数据加载器）的实现。它支持用于随机数据访问模式的地图样式数据集和用于流式处理…...
TestMAX/DFT Compiler：时序单元的类型、连接顺序和后DFT优化
相关阅读 TestMAX/DFT Compilerhttps://blog.csdn.net/weixin_45791458/category_12865937.html?spm1001.2014.3001.5482 时序单元的状态 未映射的时序单元(Unmapped Sequential Cell) 在Design Compiler读取了一个RTL设计后，Design Compiler内置的HDL Compiler工…...
(LeetCode 每日一题) 3442. 奇偶频次间的最大差值 I (哈希、字符串)
题目：3442. 奇偶频次间的最大差值 I 思路 ：哈希，时间复杂度0(n)。 用哈希表来记录每个字符串中字符的分布情况，哈希表这里用数组即可实现。 C版本： class Solution { public:int maxDifference(string s) {int a[26]…...
变量 varablie 声明- Rust 变量 let mut 声明与 C/C++ 变量声明对比分析
一、变量声明设计：let 与 mut 的哲学解析 Rust 采用 let 声明变量并通过 mut 显式标记可变性，这种设计体现了语言的核心哲学。以下是深度解析： 1.1 设计理念剖析 安全优先原则：默认不可变强制开发者明确声明意图 let x 5; …...
Qwen3-Embedding-0.6B深度解析：多语言语义检索的轻量级利器
第一章 引言：语义表示的新时代挑战与Qwen3的破局之路 1.1 文本嵌入的核心价值与技术演进 在人工智能领域，文本嵌入技术如同连接自然语言与机器理解的“神经突触”——它将人类语言转化为计算机可计算的语义向量，支撑着搜索引擎、推荐系统、…...
2021-03-15 iview一些问题
1.iview 在使用tree组件时，发现没有set类的方法，只有get，那么要改变tree值，只能遍历treeData，递归修改treeData的checked，发现无法更改，原因在于check模式下，子元素的勾选状态跟父节…...
HTML前端开发：JavaScript 常用事件详解
作为前端开发的核心，JavaScript 事件是用户与网页交互的基础。以下是常见事件的详细说明和用法示例： 1. onclick - 点击事件 当元素被单击时触发（左键点击） button.onclick function() {alert("按钮被点击了！&…...
鸿蒙DevEco Studio HarmonyOS 5跑酷小游戏实现指南
1. 项目概述 本跑酷小游戏基于鸿蒙HarmonyOS 5开发，使用DevEco Studio作为开发工具，采用Java语言实现，包含角色控制、障碍物生成和分数计算系统。 2. 项目结构 /src/main/java/com/example/runner/├── MainAbilitySlice.java // 主界…...
【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习
禁止商业或二改转载，仅供自学使用，侵权必究，如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...
【SSH疑难排查】轻松解决新版OpenSSH连接旧服务器的“no matching...“系列算法协商失败问题
【SSH疑难排查】轻松解决新版OpenSSH连接旧服务器的"no matching..."系列算法协商失败问题 摘要： 近期，在使用较新版本的OpenSSH客户端连接老旧SSH服务器时，会遇到 "no matching key exchange method found", "n…...
Caliper 配置文件解析：fisco-bcos.json
config.yaml 文件 config.yaml 是 Caliper 的主配置文件，通常包含以下内容： test:name: fisco-bcos-test # 测试名称description: Performance test of FISCO-BCOS # 测试描述workers:type: local # 工作进程类型number: 5 # 工作进程数量monitor:type: - docker- pro…...
【学习笔记】erase 删除顺序迭代器后迭代器失效的解决方案
目录 使用 erase 返回值继续迭代使用索引进行遍历 我们知道类似 vector 的顺序迭代器被删除后，迭代器会失效，因为顺序迭代器在内存中是连续存储的，元素删除后，后续元素会前移。 但一些场景中，我们又需要在执行删除操作…...