javascript - 更改div中最后一个字母的样式

Question

我有这个结构，但我无权修改标记，所以我正在寻找一个 jQuery 解决方案:

<p>Get a<strong><span>10%</span>discount</strong>in your first buy</p>

我需要的是范围内的 10 为 font-size:30px 并且范围内的 % 为 18px.

我只是把这个:

.p strong span{
    font-size: 30px;
}

strong 和 p 已经有了样式，所以我不能修改它。

但我不能那样设置 % 的样式。关于如何获得最后一封信的任何想法？同样，我无权修改结构，因此我们将不胜感激任何其他类型的解决方案。

Answer 1

你可以做这样的事情来动态添加百分比跨度:

$('p strong span:contains(%)').html(function (i, text) {
    return text.replace('%', '<span class="percent">%</span>');
});

p strong span {
    font-size: 30px;
}
p strong span .percent {
    font-size: 18px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>Get a <strong><span>10%</span> discount</strong> in your first buy</p>