Как сделать так, чтобы цена товара выглядела не 100000000р а 100 000 000р?

Question

[Monitorkin]

Есть цена товара: <span class="Price">100000000</span>
Можно ли средствами CSS сделать так чтобы цена выглядела более читабельно: Цена: 100 000 000, т.е. с отступом после каждой тройки цифр?

Answer 1

[Сергей Горностаев]

Средствами только CSS это сделать невозможно. Но можно воспользоваться простым javascript-кодом

var prices = document.getElementsByClassName('Price');
for(var x = 0; x < prices.length; x++)
    prices[x].innerHTML = prices[x].innerHTML.replace(/\B(?=(\d{3})+(?!\d))/g, ' ');

Comments

[Mikhail Osher]

прям мой гист слизаный :D

Answer 2

[Дмитрий Клусевич]

Я использую такую js-функцию, но только в том случае если это надо на лету делать, а так сервер может статику отдавать.
@Use number.ext_formatMoney
@Param fractionDigits - количество знаков после запятой
@Param decimalSeparator - десятичный разделитель
@Param separator - разделитель числовых групп

Number.prototype.ext_formatMoney = function (fractionDigits, decimalSeparator, separator) {
    var self = this,
        number,
        $fractionDigits = isNaN(fractionDigits = Math.abs(fractionDigits)) ? 2 : fractionDigits,
        $decimalSeparator = decimalSeparator == undefined ? "," : decimalSeparator,
        $separator = separator == undefined ? " " : separator,
        $self = self < 0 ? "-" : "",
        $number = parseInt(self = Math.abs(+self || 0).toFixed($fractionDigits)) + "",
        moduleLength = (number = $number.length) > 3 ? number % 3 : 0;
    return $self + (moduleLength ? $number.substr(0, moduleLength) + $separator : "") + $number.substr(moduleLength).replace(/(\d{3})(?=\d)/g, "$1" + $separator) + ($fractionDigits ? $decimalSeparator + Math.abs(self - $number).toFixed($fractionDigits).slice(2) : "");
};

Перед расширением прототипа, нужно проверить нет ли такой функции там.

Answer 3

[GreatRash]

new Number(1000000000).toLocaleString('ru-RU'); // IE11, Safari тоже в попе

Хотя...

Answer 4

[Chvalov]

https://osrec.github.io/currencyFormatter.js/

Answer 5

[Mikhail Osher]

https://gist.github.com/miraage/d00534fedd7d330a3849