提供永久免费的API接口，查看更多API接口，如果您有其他免费API资源，请联系我们，造福人类。

定制开发，免费评估，免费咨询，价格便宜，售后保障，前往开发服务中心或联系开发客服中心

在下面的示例中，首先我成功地用自己的span替换了“我自己的” '<span id="sMyOwn">my own</span>'。接下来，我想一次用一个简单的跨度全部替换其余单词（即“ This”，“ is”和“ example”）。为此，我使用函数fReplace，以便根据后面的@Abhilash注释有条件地执行此操作，但失败。我应用的第二个解决方案是一个简单的循环解决方案，但它也失败了。有人可以帮我吗。最后一行只是介绍结果。

<div id='MyOwnExample'>This is my own example</div><div id='AA'></div><script>// 1st part: It works
v1 = document.getElementById('MyOwnExample').innerHTML;
const regex = new RegExp('my own', 'gi')
v1 = v1.replace(regex,`<span id = 'sMyOwn'>my own</span>`)// 2nd part: First solution that fails
function fReplace(word, index) {
const regex = new RegExp(word, 'gi')
if (span.className != 'sMyOwn') {
v1 = v1.replace(regex,`<span>${word}</span> `)
}
}
v1.forEach(fReplace);// 2nd part: Second solution that fails too const regex2 = new RegExp(word, 'gi')for (word of v1) {
if (span.className != 'sMyOwn') {
v1 = v1.replace(regex2,`<span>${word}</span> `)
}}// 4th part: Results
document.getElementById('MyOwnExample').innerHTML = v1;
document.getElementById('AA').innerText = document.getElementById('MyOwnExample').innerHTML;</script>

查看问题中的代码，您想查看原始文本而不是html的输出，只是以防万一您需要在html中取消对最后一行的注释。

<div id='MyOwnExample'>This is my own example</div> <div id='AA'></div> <script> /**First wrap the special phrase with a span as you wantNow take out the special phrase and split the remaining text into array while you use '_' as the special phrase placeholder for later replacement.Replace each wrap each word with span as you want itPut them back while replacing the '_' placeholder with the wrapped special phrase **/ const transformer = (word,specialPhrase)=>{ const wrapSpecialPhrase = `<span id="sMyOwn"> ${specialPhrase}</span>`; const stripoffSpecialPhrase = (word.split(specialPhrase)).join("_").split(" "); const formed = stripoffSpecialPhrase.map(wd=> wd !=='_' ?`<span id='${wd}'> ${wd} </span>` : wd); return formed.join(" ").replace('_',wrapSpecialPhrase); } const aaElement = document.getElementById('AA'); const myOWnExampleElement =document.getElementById('MyOwnExample') constphrase =myOWnExampleElement.innerText; const transformed = transformer(phrase,"my own"); aaElement.innerText= transformed; // This when you want it in plain text /* aaElement.innerHTML= transformed; // This when you want it in html */ </script>

这是工作示例：

const v1 = document.getElementById('MyOwnExample').innerText; const arr = v1.split(' '); for(let i=0; i < arr.length; i++) { let str = arr[i]; arr[i] = arr[i].replace(new RegExp(str, 'gi'),`<span id='id_${str}'>${str}</span>`); } console.log(arr); document.getElementById('MyOwnExample').innerHTML = arr.join(' '); document.getElementById('AA').innerText = document.getElementById('MyOwnExample').innerHTML;

#MyOwnExample span { background-color: #dedede; display: inline-block; margin: 2px; }

<div id='MyOwnExample'>This is my own example</div> <div id='AA'></div>

一个正则表达式将在通过保留字的组安全把句子是有帮助的。

const text = "This is my own example";const yourHTML = text.split(/( |my own)/g)
.filter(v => v.trim())
.map(v => "<span"+ (v == "my own" ? " id='sMyOwn'" : "") + ">" + v + "</span>")
.join("")console.log(yourHTML)

输出：

<span>This</span><span>is</span><span>my own</span><span>example</span>

2023-03-22 10:04:19