搜索价格文本，执行功能，并替换为输出答案

【问题标题】：Search for text of prices, perform a function, and replace with output搜索价格文本，执行功能，并替换为输出
【发布时间】：2014-04-04 00:31:32
【问题描述】：

我希望能够在给定页面上找到与正则表达式匹配的价格文本，对其执行函数，然后替换输出。

例子：

<div>The total is $12</div>

RegEx 匹配 12 美元的价格文本
取 12 并乘以 2 = 24
将 12 替换为 24

变成：<div>The total is $24</div>

这是JSFiddle with my test code（请务必参考我上面的问题，谢谢！）

这里是regEx I am using

【问题讨论】：

你知道如何获得 12 吗？
您不应该将这些字符串值解析为数字，这很容易出错。而是将数据放在某种对象中，并根据这些数据更新 html 内容。然后，您将清楚地将数据表示为数字。 \
是的，我想按照上面的解释解析为正则表达式。似乎人们被我沮丧地离开的地方分心了（只是想得到一个简单的字符串）
@jonshariat 在上面的小提琴中，您是否想要更换仅有的 12 美元，甚至是 12,000 美元。
如果我不是，你想让html中的每一个价格都翻倍？

标签： javascript jquery regex replace

【解决方案1】：

试试看这是不是你要找的伙伴。

基本上，我只是将您的 replace 函数更改为

document.body.innerHTML = pageText.replace(/12/g, 'IT WORKS!!!!!!!!!!!');

刚做完

document.body.innerHTML = pageText.replace('12', 'IT WORKS!!!!!!!!!!!');

只会替换第一次出现的“12”。

Demo

【讨论】：

为了解释这一点，正则表达式上附加的g是一个global标志，这意味着它应该在第一次匹配后继续匹配。
嘿@kuna 谢谢你的回复。对不起，我不是更清楚，JS小提琴是我离开的地方（只是搜索文本）但根据我上面的解释：我正在尝试搜索RegE（也在上面链接）然后执行一个功能，然后替换它。
好的，所以如果您知道要替换 12，那么您可以使用document.body.innerHTML = pageText.replace(/12/g, doSomething(12));。希望我能理解您的问题和目标。

【解决方案2】：

您不需要使用regex。取 span 内的价格并将一个类添加到这个跨度。由于 span 是内联元素，它不会损害 html 设计。

我认为这会比regEx更好的方法

试试这样：

html:

<div>The total is $<span class="price">12</span></div>

<div>The total is $<span class="price">100</span></div>

jquery：

 $('.price').each(function(i,e){
      $(this).text(parseFloat($(this).text()*2));
  });

fiddle

【讨论】：

向原始问题中演示的值添加 $ 将返回 NaN
@BentOnCoding：我在跨度之外添加了 $，而不是在价格中。仔细看看
我认为这是最好的答案:)

【解决方案3】：

首先，您的正则表达式有缺陷。它可以修复并简化为：

/\$([\d,]+(?:\.\d+)?)/g

它被设计成第一个捕获组将是不带美元符号的数字本身。它会找到一个可选的美元符号，后跟至少一个数字，然后是一个可选的句点，如果有句点，则后跟更多数字。

然后，您可以在替换功能中使用它。为了使它加倍，你必须传递一个函数作为第二个参数来执行加倍。这看起来像这样：

pageText.replace(/\$([\d,]+(?:\.\d+)?)/g,
function (string, c1) {
    //If there are commas, get rid of them and record they were there
    var comma = c1.indexOf(',') != -1;
    c1 = c1.replace(/,/g, '');
    //Parse and double
    var value = '' + (parseFloat(c1) * 2);
    //Reinsert commas if they were there before
    if (comma) {
        var split = value.split(".");
        value = split[0].replace(/(\d)(?=(\d{3})+$)/g, "$1,");
        if(split.length > 1)
            value += "."+split[1];
    }
    //Return with dollar sign prepended
    return '$' + value;
});

c1 是第一个捕获组，它只是没有美元符号的数字。它被解析为浮点数，然后加倍。如果原始字符串中有美元符号，则在该数字前面放置一个美元符号。如果有逗号，则必须在数字加倍后将其删除并重新添加。做完这些，都回来了。

这是一个 jsfiddle 示例，您可以看到它的实际效果：http://jsfiddle.net/dB8bK/49/

【讨论】：

谢谢，这就是我想要的。唯一的想法是它不能处理像 12,000,000.99 这样的大数字，但我可以弄清楚那部分。谢谢！
嘿，有几件事我不明白。 1. 我的
在您的代码中变成了
2. 为什么使用 ParseFloat？为什么不把它作为一个注册号呢？
12,000,000.99 不起作用的原因是因为在您的示例中，您希望使用逗号作为小数的数字仍然加倍。所以正则表达式认为 12,000,000.99 是一个包含多个小数的数字。
@jonshariat 我对其进行了编辑，以便逗号现在可以使用。此外，要修复标题，您必须将其设置为需要美元符号，否则正则表达式将匹配标签中的数字。我也添加了这一点，但如果您愿意，可以通过在正则表达式中将美元符号设为可选来删除它。

【解决方案4】：

这个应该为你做的：

document.body.innerHTML = pageText.replace(/\$\d+([.,]\d+)?(?=\D\D)/g, function (match) {
    // getting digits only
    digits = match.replace(/\D/g, "");
    num = "" + digits * 2;

    // handle input: $0.009
    if(digits.match(/^0+/)){
        // left padding
        num = Array(digits.length - String(num * 2).length+1).join('0') + num;
    }

    pos_dot = match.indexOf(".");
    if(pos_dot >= 0){
        pos_dot = match.length - pos_dot - 1;
        num = num.substring(0, num.length - pos_dot) + "." + num.substring(num.length - pos_dot, num.length);

    }

    pos_comma = match.indexOf(",");
    if(pos_comma >= 0){
        pos_comma = match.length - pos_comma - 1;
        num = num.substring(0, num.length - pos_comma) + "," + num.substring(num.length - pos_comma, num.length);
    }

    return "$"+num;
});

示例输入：

<li>$12</li>
<li>$14.99</li>
<li>$2</li>
<li>$dollars</li>
<li>14.99</li>
<li>$12,000</li>
<li>$12,00,0</li>
<li>$0,009</li>

样本输出：

$24
$29.98
$4
$dollars
14.99
$24,000
$12,00,0
$0,018

注意：如果需要，您可以通过更改 (?=\D\D) 部分来调整正则表达式。

【讨论】：

【解决方案5】：

function dollarChange(match, p0, p1, p2, offset, string) {
    // pN = Nth in-parentheses match

    // Remove commas (reinjected later)
    var hasComma = (p1.indexOf(',') > -1);
    if (hasComma) p1 = p1.replace(',', '');

    // Get decimal precision
    var precision = 0;
    if (p2) {
        p1 = p1 + p2;
        precision = p2.length - 1;
    }

    // Process number
    p1 = Number(p1);
    var value = p0 + (p1 * 2).toFixed(precision);

    // Inject commas if previously found
    if (hasComma) {
        var parts = value.toString().split('.');
        parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
        value = parts.join('.');
    }

    return value;
}

// Execute replacement
document.body.innerHTML =
    document.body.innerHTML.replace(/([$])([\d,]+)(\.[\d]+)?/g,
                                    dollarChange);

JSFiddle Demo

理论上，$ 可以替换为其值之前且其值使用. 作为小数分隔符的任何货币符号。

^{请注意，这里使用的正则表达式只会匹配前面有美元符号的数字（例如，14.25 不会匹配）}

【讨论】：

【解决方案6】：

(function(context){
  var pattern=/(\$)(\d([\d\,\.]+)?)/g,
      callback=function(_,dollar,price){
           price=price.replace(/,/g,''); 
           return dollar + parseFloat(price)*2;
      },
      html=context.innerHTML.replace(pattern,callback);
  context.innerHTML=html;
})(document.body);

如果您不关心价格重新格式化 ckeck the fiddle

【讨论】：

【解决方案7】：

首先生成你的正则表达式。

var reg_exp = /\$[0-9]*\.?[0-9]*/g;  //This is your Custom Requested Regex

生成与您的正则表达式匹配的字符串列表。

var matches = document.body.innerHTML.match(reg_exp)

假设您要在整个 HTML 正文中搜索正则表达式。

定义变换函数

var transform = function(match){
    var result;
    /* Logic for genarting the resulting string, populate it in result */
    result = match.replace('$','');
    result = parseFloat(result);
    result = result * 2;
    result = '$' + result;
    return result;
};

将每个匹配项转换为它们的结果。

matches.forEach(function(match){
    console.log(match)
    result = transform(match);
    document.body.innerHTML.replace(match, result)
});

虽然还有其他答案可以完成您想要的，但我的答案总结了它以按照您想要的方式完成

【讨论】：

在您的代码中变成了

2. 为什么使用 ParseFloat？为什么不把它作为一个注册号呢？