2017-09-02 120 views
-2

我正在努力解決如何替換頁面上的任何文本實例與HTML標記匹配某個短語 - 內容應該保持不變。如何用HTML標籤替換包含字符串的文本?

bold("Hello") 

上面的代碼應改爲:

<b>Hello</b> 

這裏是我目前使用的代碼:

node.data = node.data.replace('bold("','<b>'); 
node.data = node.data.replace('")','</b>'); 

這樣做的問題是,而不是創建一個<b>標籤,將其轉換的<>到他們的HTML實體 - & LT; & gt;

而且,似乎不切實際與</b>取代的")所有實例。

什麼是最好的方式來實現這一點。

我希望得到任何幫助,這,謝謝!

+0

您需要使用的createElement工作()代替。 – iquellis

+0

或者,也許這可以幫助你:http://locutus.io/php/strings/htmlentities/ – z3nth10n

+0

什麼是'node.data',..? – Keith

回答

1

我想你不要隨便指一個網頁上的所有文本,而是一個給定的元素中的所有文本。 DucFilans是正確的與正則表達式的錢,我就稍微修改他的回答提供完整有效的解決方案:

var parserRules = [ 
 
    { pattern: /bold\("(.*?)"\)/g, replacement: '<b>$1</b>' }, 
 
    { pattern: /italics\("(.*?)"\)/g, replacement: '<i>$1</i>' } 
 
]; 
 

 
document.querySelectorAll('.parse').forEach(function(tag) { 
 
    var inner = tag.innerHTML; 
 
    parserRules.forEach(function(rule) { 
 
    inner = inner.replace(rule.pattern, rule.replacement) 
 
    }); 
 
    tag.innerHTML = inner; 
 
});
<div class='parse'> 
 
    <div>bold("Hello") world <p> Rose italics("pink") slow bold("!") </p> </div> 
 
    <div>bold("astiago") cheeeeeeese!</div> 
 
</div>

您可以定義parserRules陣列中的正則表達式模式和替換規則,然後任何標有'parse'類的元素都將被解析。一個警告是,這將取代所有的子元素,所以如果你依賴於附屬於子元素或類似的東西的聽衆,你也需要照顧。

-1

正則表達式可以幫助你更換的關注。

var str = 'bold("Hello")'; 
 
var regex = /bold\("(.*?)"\)/; 
 
str = str.replace(regex, "<b>$1</b>"); 
 

 
console.log(str);

相關問題