SweetAlert2 是一个美观、响应迅速且高度可定制的 JavaScript 弹窗库，广泛应用于网页交互中。在使用 Swal.fire() 方法显示弹窗时，默认的确认按钮文本通常为“Ok”。然而，在许多应用场景中，我们可能需要将其更改为更具描述性或符合业务逻辑的文本，例如“确定”、“好的”、“继续”甚至是带有图标的富文本。
理解 SweetAlert2 确认按钮文本自定义
早期的 SweetAlert 版本（例如 SweetAlert 1.x）可能使用 swal() 函数来配置弹窗，其配置选项与当前 SweetAlert2 的 Swal.fire() 方法有所不同。对于 SweetAlert2 用户，正确的配置方式是直接在 Swal.fire() 方法的参数对象中设置相关选项。
要更改确认按钮的文本，核心在于利用 Swal.fire() 方法提供的 confirmButtonText 选项。这个选项允许我们指定确认按钮上显示的具体文本内容。
核心配置：confirmButtonText 选项
confirmButtonText 选项接受一个字符串作为值，该字符串可以是纯文本，也可以是包含 HTML 标签的富文本。这为按钮文本的样式和内容提供了极大的灵活性。
基本用法：
只需将 confirmButtonText 属性添加到 Swal.fire() 的配置对象中，并为其赋值所需的文本。
Swal.fire({
title: '操作确认',
text: '您确定要执行此操作吗？',
icon: 'warning',
confirmButtonText: '是的，我确定！' // 自定义确认按钮文本
});高级用法：包含 HTML 内容和图标
confirmButtonText 不仅支持纯文本，还可以接受 HTML 字符串。这意味着您可以嵌入 等图标标签，或者使用 、 等标签来丰富按钮的视觉效果。
Swal.fire({
title: 'HTML 示例',
icon: 'info',
html:
'您可以使用 粗体文本, ' +
'链接 ' +
'以及其他 HTML 标签',
showCloseButton: true,
showCancelButton: true,
focusConfirm: false,
confirmButtonText:
' 太棒了!', // 带有 Font Awesome 图标的 HTML 文本
confirmButtonAriaLabel: '点赞，太棒了!', // 辅助功能文本
cancelButtonText:
'', // 带有 Font Awesome 图标的取消按钮文本
cancelButtonAriaLabel: '点踩' // 辅助功能文本
});请注意，如果使用 Font Awesome 等图标库，您需要确保已在项目中正确引入了相应的 CSS 文件。
示例代码
以下是一个结合了用户场景和解决方案的完整示例。假设我们有一个页面加载时弹出的消息，并且希望自定义其确认按钮文本。
$(document).ready(function(){
let popup_shown = false;
let cookies = document.cookie.split('; ');
// 检查是否存在名为 'zxczxc' 的 cookie，以判断弹窗是否已显示过
for( let i=0; i在这个示例中，当页面加载且 zxczxc cookie 不存在时，SweetAlert2 弹窗会显示，并且其确认按钮将显示为“知道了，谢谢！”而不是默认的“Ok”。
注意事项与最佳实践
-
版本兼容性： 确保您使用的 SweetAlert2 版本支持 Swal.fire() 及其提供的所有选项。本文内容基于 SweetAlert2 的现代 API。
-
可访问性 (Aria Label)： 当使用图标或非标准文本作为按钮内容时，强烈建议同时设置 confirmButtonAriaLabel 和 cancelButtonAriaLabel。这些属性为屏幕阅读器提供了按钮的描述性文本，极大提升了网站的可访问性。
-
取消按钮： 如果您希望弹窗同时包含确认和取消按钮，需要设置 showCancelButton: true。取消按钮的文本可以通过 cancelButtonText 选项进行自定义。
-
HTML 内容安全性： 如果 confirmButtonText 的内容来源于用户输入或外部数据，请务必进行适当的净化（sanitization），以防止跨站脚本攻击（XSS）。
-
官方文档： SweetAlert2 的官方 GitHub 页面和文档（https://sweetalert2.github.io/）是获取最新信息和详细使用指南的最佳来源。遇到问题时，查阅官方文档通常能找到最准确的解决方案。
总结
通过简单地在 Swal.fire() 配置对象中设置 confirmButtonText 选项，我们可以轻松地自定义 SweetAlert2 弹窗的确认按钮文本。无论是纯文本、富文本还是带有图标的 HTML 内容，SweetAlert2 都提供了灵活的支持。结合 confirmButtonAriaLabel 等辅助功能选项，可以进一步提升用户体验和网站的可访问性。掌握这一技巧，将使您的弹窗更加符合应用的需求和品牌风格。
