将 html 文本替换为 jquery

Question

我有这个 html:

<div class="field-item even">0,00 €</div>

我有这个功能来替换一些文本，效果很好：

$('.field-name-commerce-price .field-item').html(function(i, oldhtml) {
  return oldhtml.replace('0,00 €', '<span style="font-size:13px;">No price</span>');  

});

但我需要将函数更改为这个，根本不起作用（console.log 中没有错误）：

$('.field-name-commerce-price .field-item').html(function(i, oldhtml) {
  return oldhtml.replace('>0,00 €<', '><span style="font-size:13px;">No price</span><');  

});

如您所见，我刚刚添加了一些“<”和“>”。

以防万一您想知道我为什么需要这样做：我需要避免使用函数来替换“150,00 €”、“90,00 €”等值。我需要它来替换值“0,00 €”，只有这个。

Answer 1

目前还不清楚您为什么需要这样做，但是：

问题是 > 和 < 不是 .field-info 标签的 HTML contents 的一部分，它们是标签。调用 .html() 不会 return 包装当前节点的标签。

给定 HTML 片段 DOM...

<div class="field-name-commerce-price">
  <div class="field-item even">0,00 €</div>
</div>

使用$(.field-item).html()将return0,00 €、HTML标签内容选中。没有 > 或 < 匹配。

如果您想自己替换部分标签，可以转到元素的父元素。使用 $('.field-item').parent().html() 将 return 嵌套元素的 HTML、<div class="field-item even">0,00 €</div> 将匹配您的 replace.

尝试以下操作：

$('.field-name-commerce-price .field-item').html(function(i, oldhtml) {
  return oldhtml.parent().replace('>0,00 €<', '><span style="font-size:13px;">No price</span><');  

});

--

回复：您的更新

Just in case you want to know why I need to do this: I need to avoid the function to replace values like '150,00 €', '90,00 €' and so. I need it to replace the value '0,00 €', only this one.

然后，使用 > 和 < 作为替换字符串的分隔符是错误的解决方案。要么使用简单的相等性检查...

if ('0,00 €' == $('.field-name-commerce-price .field-item').text()) {
  $('.field-name-commerce-price .field-item').html('<span style="font-size:13px;">No price</span>'); 
}

或者，使用正则表达式，并使用 ^ 和 $ 锚定您的搜索模式，或者添加伤口边界：

$('.field-name-commerce-price .field-item').html(function(i, oldhtml) {
  return oldhtml.replace(/\b0,00 €\b/, '<span style="font-size:13px;">No price</span>');  
});

Answer 2

您应该尝试使用正则表达式

return oldhtml.replace(/^0,00 €$/, '<span style="font-size:13px;">No price</span>');

将 html 文本替换为 jquery

Replace html text with jquery

jquery

replace