RegExp"g"标志不替换每个实例

Question

我正在研究EM到PX转换器.基本上你将代码粘贴到"PX"textarea中,然后相同的代码将出现在带有em值的"EM"textarea中.它有点工作,但不会取代所有实例的价值.例如:如果键入"padding:5px;" 它会给你"填充:0.313em;" 成功.但是......如果你输入"padding:5px 4px;" 它只将"px"替换为"em"而不是实际的数字值.

在这里尝试一下:: http://jsfiddle.net/tJsNz/

        function pxToEm(){
        var px = document.getElementById("px"),
            em = document.getElementById("em"),
            parent = document.getElementById("parent-font-size");

        var pxVal = px.value.match(/\d+/ig);
        var pxToEm = 1 / parent.value * pxVal;
        var pxToEmFixed = pxToEm.toFixed(3);
        var pxToEmAnswer = px.value.replace(pxVal, pxToEmFixed).replace(/px/ig, "em");

        em.value = pxToEmAnswer;
    }

Answer 1

考虑使用.replace带有回调函数.我想这就是你想要的 - 找到每一场比赛并根据它进行替换.

String的.replace方法可以接受回调作为第二个参数,并在每次匹配时运行该回调.您可以运行它并匹配所有数字,然后用它们的翻译值替换它们.

更简单的例子

var i=0;
"aaaaaa".replace(/a/g,function(match){
    return i++;
});

会回来"012345".这是MDN的另一个例子

在你的情况下像:

var pxToEmAnswer = px.value.replace(/\d+/ig, function(match){
    return 1 / parent.value * match;
}).replace(/px/ig, "em");

(小提琴)