2016-12-21 251 views
1

我目前正在尋找一種將匹配文本轉換爲粗體html行的方法。除了特殊字符給我帶來問題之外,我已經部分工作了,因爲我希望保留原始字符串,但不能比較原始字符串。匹配並替換子字符串,而忽略特殊字符

例子:

鑑於原始字符串:

Taco John's is my favorite place to eat. 

,並希望以匹配:

is my 'favorite' 

爲了得到期望的結果:

Taco John's <b>is my favorite</b> place to eat. 

的方式我現在克在匹配的字符串周圍多餘的報價ETTING是替換它們

let regex = new RegExp('('+escapeRegexCharacters(matching_text.replace(/[^a-z 0-9]/gi,''))+')',"gi") 
let html= full_text.replace(/[^a-z 0-9]/gi,'').replace(regex, "<b>$1</b>")}}></span> 

這幾乎工作,但我失去了所有的標點符號:

Taco Johns <b>is my favorite</b> place to eat 

有沒有辦法使用正則表達式,或者另一種方法,在匹配過程中忽略匹配短語的標籤而忽略大小寫字符和特殊字符?

更新#1:

看來,我是不清楚。我需要將原始字符串的puncuation留在最終結果的html中。我需要匹配的文本邏輯來忽略所有特殊字符和大小寫。所以is my favoriteis My favoriteis my 'favorite'應該都會觸發匹配。那裏是一個模式,但是,在這種情況下,你有一個直接匹配

+0

您所提供的正則表達式的整點是消除任何不屬於「AZ」 (空格)或數字。因此只能刪除標點符號:https://regex101.com/r/M9HrNF/1 –

+0

如果您成功轉義正則表達式字符,爲什麼您需要刪除非字母數字+空格? – Scimonster

+0

@DoTheDew正確的,截至目前,我正在刪除標點符號以獲得匹配,但我希望將標點符號保留在最終結果中,但具有刪除特殊字符的匹配邏輯。 –

回答

1

而是從去除特殊字符要搜索的字符串,可以在正則表達式中插入每個字符之間的模式,以避免可能出現的任何特殊字符。你建立可直接應用於字符串的正則表達式的方式被搜索和替換操作將因此不會觸碰特殊字符的比賽之外:

let escapeRegexCharacters = 
 
     s => s.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"), 
 
    full_text = "Taco John's is My favorite place to eat."; 
 
    matching_text = "is my 'favorite'"; 
 
    regex = new RegExp(matching_text.replace(/[^a-z\s\d]/gi, '') 
 
       .split().map(escapeRegexCharacters).join('[^a-z\s\d]*'), "gi"), 
 
    html = full_text.replace(regex, "<b>$&</b>"); 
 

 
console.log(html);

+0

這幾乎完全正確。但是,當大寫不匹配時它會失敗。所以如果matching_text是「是我最喜歡的」,它不會匹配,但我需要它。這就是爲什麼我使用'i'標誌,可以使用你的字符匹配方法嗎? –

+0

改編:將'gi'參數添加到主'新RegExp()'中。 – trincot

+0

我看到了,我試圖在錯誤的位置添加'gi'標誌。謝謝!這非常聰明。 –

1

正則表達式是有用的,因此,良好的方法是使用一個String.prototype.replace

function wrap(source, part, tagName) { 

    return source 
    .replace(part, 
     `<${tagName}>${part}</${tagName}>` 
    ) 
    ; 
} 

至少,如果有模式,你應該編輯你的問題並提供它。

+0

確實如此,除了替換將完全匹配特殊字符。所以做''Taco John's是我最喜歡的地方吃飯。「replace(」是我最喜歡的「,」ANYING「)'不會工作,因爲'part'變量中多了額外的單引號。 –

0

有可能避免使用捕獲組與$& replacement string,這意味着「整個匹配的子」:

var phrase = "Taco John's is my favorite place to eat." 
var matchingText = "is my favorite" 

var re = new RegExp(escapeRegexCharacters(matchingText), "ig"); 
phrase.replace(re, "<b>$&</b>"); 

(代碼基於obarakon的答案。)

0

泛化,該正則表達式,你可以使用is my /w+。您可以使用的替代品的功能,讓您可以JavaScript操作產生的文本:

var str = "Taco John's is my favorite place to eat."; 
 
var html = str.replace(/is my \w*/, function (x) { 
 
    return "<b>" + x + "</b>"; 
 
}); 
 

 
console.log(html);