Javascript使用正则表达式搜索字符串

Javascript Searching Strings Using Regular Expression

本文关键字:搜索 字符串 正则表达式 Javascript      更新时间:2023-09-26

我试图使用正则表达式完成2个任务——一个函数在第一个字符串中搜索第二个字符串,另一个函数替换第一个字符串中第二个字符串值的所有出现。用户将字符串输入到文本框中,并单击按钮,结果将在段落中读取。

function searchStrings() {
    var searchexp1 = document.getElementById("req1string1").value;
    var searchexp2 = document.getElementById("req1string2").value;
    var patt = new RegExp("searchexp2");
    var res = patt.test("searchexp1");
    if (res === true) {
        document.getElementById("req1result").innerHTML = "We found a match!";
    } else if (res === false) {
        document.getElementById("req1result").innerHTML = "Sorry, those strings don't match.";
    } 
}
function replaceString() {
    var searchexp1 = document.getElementById("req2string1").value;
    var searchexp2 = document.getElementById("req2string2").value;
    var str = document.getElementById("req2string1").innerHTML;
    var res = str.replace("searchexp1"/g , "searchexp2");
    document.getElementById("req2result").innerHTML = res;
}

都不工作,我不能从我使用的教程中找出原因。我错过了什么?

replace接受regex模式作为要替换的模式。RegExp接受修饰符作为第二个参数。你可以输入:

new RegExp(yourVariable, 'g');

,然后将其作为模式包含在replace调用中。

此外,您可能希望删除变量名周围的引号(用于将值存储在文本框中)。这样,您将实际使用它们包含的值,而不是它们的名称(如字符串)。

new RegExp(yourVariable);

new RegExp("yourVariable");

同时,假设

var str = document.getElementById("req2string1").innerHTML;

str设置为inputBox的值您应该使用.value而不是.innerHTML

var str = document.getElementById("req2string1").value;

function searchStrings() {
    var searchexp1 = document.getElementById("req1string1").value;
    var searchexp2 = document.getElementById("req1string2").value;
    var patt = new RegExp(searchexp2);
    var output;
    if (patt.test(searchexp1)) {
        output = "We found a match!";
    } else {
        output = "Sorry, those strings don't match.";
    }
    document.getElementById("req1result").innerHTML = output;
}
function replaceString() {
    var searchexp2 = new RegExp(document.getElementById("req2string2").value, 'g');
    var searchexp3 = document.getElementById("req2string3").value;
    var str = document.getElementById("req2string1").value;
    document.getElementById("req2result").innerHTML = str.replace(searchexp2, searchexp3);
}
.button {
    border: 1px solid black;
    border-radius: 3px;
}
.button:hover {
    cursor: pointer;
}
<div id="req1result"></div></br>
<span>String:</span>
<input id="req1string1" type"text"/>
<span>Pattern:</span>
<input id="req1string2" type="text"/></br>
<span class="button" onclick="searchStrings();">Search</span></br>
<div id="req2result"></div></br>
<span>String:</span>
<input id="req2string1" type"text"/>
<span>Pattern:</span>
<input id="req2string2" type="text"/>
<span>Replace with:</span>
<input id="req2string3" type="text"/></br>
<span class="button" onclick="replaceString();">Replace</span>