我如何在這個表達式逃避一個變量

Question

請參閱以下內容： https://regex101.com/r/gG3eO8/1

我想要做的是，而不是使用字符串常量，在這種情況下，「我H1」，我想插入一個變量出現使價值是動態的，下面是我試過，但想我不是正確轉義它

var value = "random string"; 
"/<h1>.*?" + value + ".*?<\/h1>/g" 

什麼是逃避以上的正確方法？

Answer 1

使用RegExp構造函數。

if (!RegExp.escape) { 
    RegExp.escape = function (value) { 
     return value.replace(/\W/g, "\\$&") 
    }; 
} 
var reg = new RegExp("<h1>.*?" + RegExp.escape(value) + ".*?</h1>", "g"); 

Answer 2

我猜你的問題是，你想阻止HTML注入到你的頁面。幸運的是，這是一個前所未有的問題！

如果您在瀏覽器的時候，你可能會使用jQuery

var $el = $('<h1 />').text(myVariable); 

如果沒有，你可能會拉these lines從鬍子：

var entityMap = { 
    '&': '&', 
    '<': '&lt;', 
    '>': '&gt;', 
    '"': '&quot;', 
    "'": '&#39;', 
    '/': '&#x2F;' 
}; 

function escapeHtml (string) { 
    return String(string).replace(/[&<>"'\/]/g, function fromEntityMap (s) { 
    return entityMap[s]; 
    }); 
} 

var el = '<h1>' + escapeHtml(myVariable) + '</h1>'; 

Answer 3

如果你要搜索<h1>元素包含某個字符串值，您可以簡單地使用DOM函數迭代這些元素。

var value = "I'm H1"; 
 

 
[].forEach.call(document.querySelectorAll('h1'), function(el) { 
 
    var t = el.textContent || el.innerText || ''; 
 
    if (t.indexOf(value) != -1) { 
 
    alert('Found it!'); 
 
    } 
 
});

<h1>I'm H1 buddy</h1> 
 
<h1>I'm also H1</h1> 
 
<h1>Hi I'm H1</h1>

它會顯示在此情況下，ALTER兩次。

如果您在變量中有HTML，您可以創建一個臨時<div>元素並設置其.innerHTML屬性以創建要從中進行搜索的根節點。