格式编号价格样式JS
问题描述:
我想逗号后格式化数的价格,用较小的字体: 格式编号价格样式JS
例如,我有这样的跨度:
<span class="price">9,95€</span>
我需要的东西,如更换:
<span class="price">9,<span class="small-price">95€</span></span>
我该如何使用javascript,php或css?
答
请在下面的代码片段中找到我们可以使用regex
来做到这一点。
$.each($('.price'), function() {
var price = $(this).html();
$(this).html(price.replace(/(\d*\,)(\d*)(\D*)/, '<span style="font-size:22px;">$1</span><span style="font-size:16px;">$2</span><span style="font-size:14px;">$3</span>'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='price'>270,30€</div>
+2
如果您对任何人的答案进行了投票,请留下一些意见 – Curiousdev
+0
这对我有用。嗯,你可以使用preg_replace()函数用php代码编辑你的答案吗? –
答
你可以这样做在CSS中,并不难
.small-price {
font-size: 7pt;
}
5,<font class="small-price">95</font>
答
试试这个:
var prices = document.getElementsByClassName('price');
for (var i = 0; i < prices.length; i++) {
var priceEl = prices[i];
var price = priceEl.innerHTML;
var priceParts = price.split(',');
var smallPriceValue = priceParts[1];
if (smallPriceValue) {
var span = document.createElement('span');
span.className = "small-price";
span.innerHTML = smallPriceValue;
priceEl.innerHTML = priceParts[0]+ ",";
priceEl.appendChild(span);
}
}
.price {
font-size: 18px;
}
.small-price {
font-size: 12px;
}
<span class="price">9,95€</span><br>
<span class="price">12,85€</span>
答
你可以使用document.getElementsByClassName
,并与普通的JavaScript更改元素。
[].forEach.call(document.getElementsByClassName('price'), function (a) {
a.innerHTML = a.innerHTML.replace(/(\d\d€)/, '<span class="small-price">$1</span>');
});
.price { font-size: 36px; }
.small-price { font-size: 24px; }
<span class="price">9,95€</span><br>
<span class="price">0,01€</span>
一些建议:欧元符号必须在值之前。 –
^^这取决于文化。 –
这取决于语言。用英文写42欧元;法语和意大利语是42欧元。 – bfontaine