我可以使用css在html中设置整数值的样式

Question

我想知道,有没有办法只在给定的类中设置整数？

我的HTML看起来像这样:

<div class="output">0 hours 12 minutes and 40 seconds remaining</div>

所以我想只做整体粗体

我正在寻找另一种选择:

 <div class="output"><b>0</b> hours <b>12</b> minutes and <b>40</b> seconds remaining</div>

Answer 1

您可以使用正则表达式和a .replace.

$(".output").html(function() {
	return $(this).text().replace(/(\d+)/g,"<strong>$1</strong>");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="output">0 hours 12 minutes and 40 seconds remaining</div>

或者使用纯JavaScript.

// See this answer about getting text: http://stackoverflow.com/a/6743966/1150683
var el = document.getElementsByClassName('output')[0];
var text = el.innerText || el.textContent || '';

el.innerHTML = text.replace(/(\d+)/g,"<strong>$1</strong>");

<div class="output">0 hours 12 minutes and 40 seconds remaining</div>