正則表達式保持指定的CSS規則

-2

花了好幾個小時對此做了大量的搜索，並且無處可去。尋找RegEx guru的幫助。我正在尋找一個RegEx，可以刪除我指定的所有CSS樣式規則。例如，採取下面的例子輸入：正則表達式保持指定的CSS規則

<p style="font-size:10px">Text.</p> 
<p><span style="font-size:12px; text-transform:uppercase">More text</span></p> 
<p><span style="text-decoration:line-through; text-transform:uppercase;">Even more</span></p>

我在尋找這樣的輸出：

<p>Text.</p> 
<p><span style="text-transform:uppercase">More text</span></p> 
<p><span style="text-decoration:line-through; text-transform:uppercase;">Even more</span></p>

所以只保留text-transform:uppercase和text-decoration:underline。如果這需要在幾個RegExes中被打破，那很好。即第一個離開空style=""標籤我可以刪除那些後。這裏的關鍵是我想指定要保留的規則，而不是要刪除所有可能的規則。

感謝所有幫助

更新：我來最接近的是這樣的：

style=".*?(text-decoration:line-through|text-transform:uppercase)*.*?"

，並以$ 1更換。問題是它沒有捕獲我在捕獲組之後添加*時要保留的規則。

來源

2015-10-21 Todd1561

你爲什麼要使用正則表達式呢？ – Nit

由於我不得不爲項目使用第三方轉換工具，因此只能通過RegEx進行這種更改。否則，是的，我會使用某種CSS解析器。 – Todd1561

只需通過Phantomjs或類似的東西傳遞中間結果即可。 – Nit

我認爲黑名單在這裏比白名單更容易。在我深入研究之前，我會先嚐試一下。

/(font-size|color):[^;]+(; |)?/g

這裏是我的測試：

var test = 'style="font-size:12px; color:red; background:blue; color:blue"' 

// style="background:blue; " 
test.replace(/(font-size|color):[^;]+(; |)?/g, '');

編輯之後你說的CSS是一致的。

來源

2015-10-21 16:24:53

你是對的，黑名單會容易得多。但是，我不知道可以包含多少種不同的CSS規則。我確實知道的是我只想讓這兩個人留下來。感謝您的意見，但。如果我不能拿出一個不錯的白名單，這可能是下一個最好的事情。 – Todd1561

我已確認您的正則表達式使用軟件生成的標記，它比我昨天提出的黑名單方法更清潔。但我仍然想嘗試使用白名單方法。 – Todd1561

好吧，它看起來並不像我要獲得一個白名單，所以我已經開始了黑名單。經過進一步測試，比爾的一個問題導致它不僅僅匹配CSS。所以我想出了以下這些似乎運作良好的主要基於比爾的想法，所以感謝他發佈。

(font-size|color):.*?(;|(?="))

如果任何人想出一個白名單解決方案，我仍然開放。

來源

2015-10-22 19:31:31 Todd1561

正則表達式保持指定的CSS規則

回答

相關問題