前端设置一个默认数值,然后该数值打到五位数之后自动转换成万级单位,十万转换成10W,以此往上类推。
这个结构需要提取数字格式化后再替换,注意js代码用现在最新的,其他的不要增加
<span class="number">10000人阅读</span><br />
<span class="number">100000人阅读</span>
<script>
function getFormat(num) {
if (num >= 100000000) {
return Math.floor(num / 100000000) + '亿'
}
if (num >= 10000) {
return Math.floor(num / 10000) + '万'
}
return num;
}
window.addEventListener('load', function () {
var numbers = document.querySelectorAll('.number');
var cttimer = setInterval(function () {
if (!/\d+/.test(numbers[0].innerHTML)) return;//模板未渲染退出
//已经成功渲染数据
clearInterval(cttimer)//清除计时器
//执行格式化代码
for (var i = 0; i < numbers.length; i++) {
var m = /\d+/.exec(numbers[i].innerHTML);//提取数字部分
numbers[i].innerHTML = numbers[i].innerHTML.replace(m[0], getFormat(parseFloat(m[0])))
}
}, 100);
});
</script>
有帮助麻烦点下【采纳该答案】
我根据你提供的思路是不是这样的
首先需要模板渲染出实际的数值,渲染成功后然后再执行下面的转换代码。
如果未渲染成功则跳出。渲染成功后自动进行转换。
逻辑是这样的吗?但我不知道咋写JS
新问题似乎又出来了.....
就是时而成功,时而失败,这就好尴尬.....