Bootstrap徽章怎么动态更新数字不刷新页面？

一昊然提问于 2026-02-28 15:10:19 阅读 9

组件

我用Bootstrap的badge做消息通知，但不知道怎么在JS里动态改数字。试过直接改innerHTML，结果样式没了。

比如原来代码是5，我想改成10，但一替换整个span就变普通文字了。

是不是得用特定方法？或者要重新初始化？求指点！

我来解答赞 1 收藏

反馈

1 条解答

Mr.祖溢 Lv1

你这是把整个span都干掉了，当然样式没了。只改文本内容就行，别动标签本身。

用 textContent 或者 jQuery 的 text() 方法：

// 原生JS

document.querySelector('.badge').textContent = '10';



// jQuery

$('.badge').text('10');

检查一下你的代码，是不是用了 innerHTML 或者 html() 把整个元素给覆盖了，那样class就丢了。

2026-02-28 18:01