jquery查找文本并更改大小答案

【问题标题】：jquery find text and change sizejquery查找文本并更改大小
【发布时间】：2013-10-22 00:20:24
【问题描述】：

我在 div“price”中有一个 грн 文本，跨度类为“price-red”

    <div class="price">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
    <td width="190"><span class="price-text">Цена для вас:</span></td>
    <td></td>
    <td></td>
</tr>
<tr><td colspan="3" height="10"></td></tr>
<tr>
    <td><nobr><span class="price-red"><b>299 грн.</b></span></nobr></td>
    <td></td>
    <td></td>
</tr>
</table>
</div>

css

.price-red{
font-family: Arial, Helvetica, sans-serif;
font-size: 60px;
text-transform: none;

}

我需要用 jquery 找到它，并将字体从 60px 更改为 40px，仅用于“грн” 所以我尝试了这个：

<script>
$(document).ready(function(){
  $('span.price-red:contains("грн")').css('font-size', '40px');
});
</script>

文本 299 грн. 由 php 生成，如下所示：

<td><?php if (!empty($special)){ ?><span class="price-red">Sale!</span><?php }else{ ?><nobr><span class="price-red"><b><?php echo $price; ?></b></span></nobr><?php } ?></td>
    <td><?php if (!empty($special)){ ?><span class="price-red"><b><?php echo $special; ?></b></span><?php } ?></td>
    <td></td>
</tr>

回答

   $(document).ready(function(){
$('span.price-red:contains("грн")').html(function () {
    return this.innerHTML.replace("грн", "<span style='font-size:40px'>грн</span>")
});
});

【问题讨论】：

$('span.price-red div:contains("грн")').css('font-size', '40px');
这里工作正常jsfiddle.net/Alfie/JZUR3/2
你的小提琴适合我。

标签： javascript jquery css font-size contains

【解决方案1】：

如果您只想更改 rph，您可以使用 html() 执行此操作并使用 span 包装 rph

$('span.price-red:contains("грн")').html(function () {
    return this.innerHTML.replace("грн", "<span style='background:blue;font-size:40px;'>грн</span>")
});

DEMO

【讨论】：

他并没有要求只更改“грн”，他想更改所有跨度样式。
@ShlomiHassid 在他写的问题中>>我需要用 jquery 找到它并将字体从 60px 更改为 40px 仅用于“грн”所以我尝试了这个：

【解决方案2】：

您的代码看起来不错。问题可能是字符编码。如果您的 jQuery 代码和 HTML 放在不同的文件中，它们可能具有不同的编码。
要对其进行测试，请尝试将 span 内容替换为一些标准字母，例如“rph”，并查看 :contains 选择器是否适用于它们。

【讨论】：

【解决方案3】：

$(document).ready(function(){
  $('.price span.price-red:contains("грн")').css('font-size', '40px');
});

参考contains-selector

【讨论】：

谢谢！它正在工作，但它改变了整个价格，而不仅仅是“грн”
@user1429497 你不能改变 textNodes 的字体大小，你应该用另一个元素和样式来包装文本。