JavaScript 多行字符串对齐
json格式数据如下:
[{'name':'张三','pcs':'40','total':'3600'},
{'name':'李老五','pcs':'2','total':'400'},
{'name':'Jack','pcs':'121','total':'59800'},
{'name':'王-ADU','pcs':'21','total':'1130'}]
拼接成字符串,用 js 怎样解决对齐问题,请大神帮助下,万分感谢!
张三 40单 3600件
李老五 2单 400件
Jack 121单 59800件
王-ADU 21单 1130件
想要达到的效果如下图
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
你这不是table吗,样式自己写下就行了,;
左对齐 text-align:left;
右对齐 text-align:right;
还是我理解错你的意思了???
这个其实应该是前端展示的时候考虑的数据吧,分栏处理就好解决。这里主要是数字和字母等等与汉字不等宽,容易造成展示问题。
不过也有其他的方法,每行分3个部分填充,填充后统计个部分最长宽度,注意汉字符算2个,其他算一个,这样每部分以最长字符数为基准,再填补个空白字符为隔离字符(注意不同的对齐方式隔离字符填充的位置不同),其它行相对的部分都以此总长度进行空白填充,然后把没行接在一起。
2楼回答正解,这设置个样式就行
https://jsbin.com/wucavabazi/edit?html,js,output
最简单的实现
pre 标签, 空格换成 \t
display: table;
去了解下为赚声望随便答个。