Web 应用程序中的数字本地化 [英] Numbers localization in Web applications
问题描述
如何在不更改字符代码的情况下设置阿拉伯数字的变体?
How can I set the variant of Arabic numeral without changing character codes?
Eastern Arabic ۰ ۱ ۲ ۳ ٦ ٥ ٤ ۷ ۸ ۹
Persian variant ۰ ۱ ۲ ۳ ۴ ۵ ۶ ۷ ۸ ۹
Western Arabic 0 1 2 3 4 5 6 7 8 9
(And other numeral systems)
这是一个示例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div lang="fa">0123456789</div>
<div lang="ar">0123456789</div>
<div lang="en">0123456789</div>
</body>
</html>
如何仅使用客户端技术(HTML、CSS、JS)来做到这一点?
该解决方案应该对页面的 SEO 分数没有负面影响.
How can I do this using only client-side technologies (HTML,CSS,JS)?
The solution should have no negative impact on page's SEO score.
请注意，在 Windows 文本框(例如 Run)中，数字会根据周围文本的语言正确显示.
Note that in Windows text boxes (e.g. Run) numbers are displayed correctly according to language of surrounding text.
另请参阅:桌面应用程序中的数字本地化
注意:使用这个 PHP 包 https://github.com/salarmehr/cosmopolitan
Note: Localisation of numbers are super easy on backend using this PHP package https://github.com/salarmehr/cosmopolitan
推荐答案
一个新的(迄今为止)简单的 JS 解决方案是使用 Intl.NumberFormat.它支持数字本地化、格式变化以及本地货币(有关更多示例，请参阅文档).
A new (to date) and simple JS solution would be to use Intl.NumberFormat. It supports numeral localization, formatting variations as well as local currencies (see documentation for more examples).
使用一个与 MDN 自己的非常相似的示例:
To use an example very similar to MDN's own:
const val = 1234567809;
console.log('Eastern Arabic (Arabic-Egyptian)', new Intl.NumberFormat('ar-EG').format(val));
console.log('Persian variant (Farsi)',new Intl.NumberFormat('fa').format(val));
console.log('English (US)',new Intl.NumberFormat('en-US').format(val));Intl.NumberFormat 似乎也支持字符串数值，并在它不是本地语言中的数字时进行指示.
Intl.NumberFormat also seems to support string numeric values as well as indicates when it's not a number in the local language.
const val1 = '456';
const val2 = 'Numeric + string example, 123';
console.log('Eastern Arabic', new Intl.NumberFormat('ar-EG').format(val1));
console.log('Eastern Arabic', new Intl.NumberFormat('ar-EG').format(val2));
console.log('Persian variant',new Intl.NumberFormat('fa').format(val1));
console.log('Persian variant',new Intl.NumberFormat('fa').format(val2));
console.log('English',new Intl.NumberFormat('en-US').format(val1));
console.log('English', new Intl.NumberFormat('en-US').format(val2));对于语言环境标识符(传递给 NumberFormat 构造函数的字符串，指示语言环境)，我尝试了上面的值，它们看起来很好.我尝试查找所有可能值的列表，并通过 MDN 遇到 本文档和此列表可能会有所帮助.
For the locale identifier (string passed to NumberFormat constructor indicating locale), I experimented with the values above and they seemed fine. I tried finding a list for all possible values, and through MDN came across this documentation and this list that could be helpful.
我不熟悉 SEO，因此不确定这如何回答这部分问题.
I'm not familiar with SEO, and am thus unsure how this answers that part of the question.
这篇关于Web 应用程序中的数字本地化的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
