更改字符串中的某些數字

我有一個有時包含css字體大小的字符串。例如：更改字符串中的某些數字

str = '<span style="font-size: 200px;white-space:nowrap;">Text</span> 
<br><span style="color:#555555;font-size:10px;">Some otherText</span>';

我需要乘以它們全部由例如1.5

var ratio = 1.5;

搜索的一組比改變所有的字體大小和更換是不是我的強項。如何搜索所有字體大小的字符串，然後對每個數字進行數學計算？

所以這上面的字符串這個比例將變爲：

str = '<span style="font-size: 300px;white-space:nowrap;">Text</span> 
<br><span style="color:#555555;font-size:15px;">Some otherText</span>';

來源

2013-01-24 John Smith

您可以使用正則表達式，其中「：0000px」，如果你一定要使用一個單位「px」，然後從字符串中獲取所有數字並解析它們。 –

不要使用JavaScript破解原始HTML。 DOM是你的朋友。 – NullUserException

假定有一個字符串並沒有更好的辦法（如果這從innerHTML左右來了，你是幹什麼的它錯了），然後...

var fauxDocFrag = document.createElement("div"); 
var elements, i, len; 

fauxDocFrag.innerHTML = str; 

elements = fauxDocFrag.getElementsByTagName("*"); 

for (i = 0, len = elements.length; i < len; i++) { 
    elements[i].style.fontSize = (parseInt(elements[i].style.fontSize) * 1.5) 
           + "px"; 
} 

str = fauxDocFrag.innerHTML;

jsFiddle。

如果你的瀏覽器不吸...

var fauxDocFrag = document.createElement("div"); 

fauxDocFrag.innerHTML = str; 

[].forEach.call(fauxDocFrag.getElementsByTagName("*"), function(element) { 
    element.style.fontSize = (parseInt(elements.style.fontSize) * 1.5) 
           + "px"; 
}); 

str = fauxDocFrag.innerHTML;

如果有任何的聲明中style屬性沒有，你可以使用getComputedStyle()。

我沒有使用真實的documentFragment，因爲它不支持innerHTML屬性。

來源

2013-01-24 00:11:06 alex

有人說，將base（radix）參數傳遞給'parseInt'總是好的。 – VisioN

@VisioN在閱讀fontSize屬性時，我的瀏覽器總是去掉前導'0'，並且任何十六進制的值都返回一個空字符串。 – alex

它像一個魅力。謝謝Alex - 創建div的目的是什麼？這種方法比尼克建議的更好嗎？ –

您可以使用replace方法的String對象，並指定一個函數作爲重置值。

str.replace(/font-size:\s*(\d*)/g, 
      function (line, p1) { return ratio * parseInt(p1) })

來源

2013-01-24 00:14:21 tom

我考慮過這個，但它不知道*關於'style'屬性。如果我將它作爲一個子字符串包含在文本節點中，它將會被破壞。 – alex

亞歷克斯是正確的，可能還有一個更好的方法，但用字符串替換答案來回答你的問題：

str = str.replace(/(\d+)px/g, function (fullStr, pixels) { 
    return (pixels * 1.5) + 'px'; 
});

來源

2013-01-24 00:14:59 nickf

歡迎回來！ :) – alex

Sheesh，你什麼時候比我更多的代表，是吧？我收回了這個贊成票。 – nickf

你離開後有人不得不撿起鬆弛的東西：D – alex

更改字符串中的某些數字

回答

相關問題