Question

我正在尝试改变数字的样式。

我想在每3个数字之间添加一些空格。
我会确切地知道数字在html中的位置。
当我从html中检索号码时，它需要与我输入的号码完全相同。所以我只想设置数字，而不是修改数字。
我可以使用javascript和/或css来尝试实现此功能

//test for success . . . do not remove
if(document.getElementById('number').innerHTML !== "1000"){
  alert('Wrong answer, you changed the number!!!');
}

<p id="number">1000<p>

<p>The 1000 above should show up like 1 000<p>

Answer 1

尝试这样的事情。

const numberWithSep = (x) => {
  return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, "<div class='sep'></div>");
}

var num = numberWithSep('12345678');


document.getElementById("number").innerHTML = num;

//retrive like this
console.log(document.getElementById("number").innerText);

.sep {
  display: inline-block;
  padding: 10px;
}

<p id="number"><p>

如果您希望分隔符为逗号（，），只需将div更改为,

Answer 2

我建议使用Filter filter = dbContext.Filters.First(x => x.FilterId == filterId); var pb = new PredicateBuilder<User>(); foreach(var inclusion in filter.Inclusions) { if(inclusion.Age.HasValue) { pb = pb.And(p => p.Age == inclusion.Age.Value); } if(!string.IsNullOrWhiteSpace(inclusion.Name)) { pb = pb.And(p => p.Name == inclusion.Name); } } foreach(var exclusion in filter.Exclusions) { if(exclusion.Age.HasValue) { pb = pb.And(p => p.Age != exclusion.Age.Value); } if(!string.IsNullOrWhiteSpace(exclusion.Name)) { pb = pb.And(p => p.Name != exclusion.Name); } } var filteredUsers = dbContext.Users.AsExpandable().Where(pb);，以便“sep”字符位于自动确定的display:flex中。

我们的想法是通过js将font-size变为1000。

然后，通过css生成的内容直观地添加“sep”字符。 1000。这样，span:nth-last-of-type(3n) { content:<sep>; ..}（实际上可以是任何字符）将具有与数字文本相同的字体大小。

demo

我如何设置数字样式？

2 个答案: