我希望输出看起来像这样：stephenpeterben但是“e”字符具有背景颜色。这可以使用下面的代码和一些 javascript 吗？<!DOCTYPE html><html><head></head><body><div>stephen<p id="demo">peter</p>ben</div><script></script></body></html>
2 回答
红糖糍粑
TA贡献1815条经验 获得超6个赞
获取名称，将它们拆分为字母，通过比较函数传递每个字母，如果是 e，则添加一个带有高亮类的跨度。
var names = document.querySelectorAll('p');
names.forEach(function(name){
var letters = name.innerText.split('');
var newName = '';
letters.forEach(function(letter){
newName += isE(letter);
})
name.innerHTML = newName;
})
function isE(letter){
let newStr =''
letter.toLowerCase() == 'e'
? newStr += '<span class="highlight">'+ letter +'</span>'
: newStr = letter;
return newStr;
}
.highlight {
background-color: yellow
}
<p id="demo1">stephen</p>
<p id="demo2">peter</p>
<p id="demo3">ben</p>
胡说叔叔
TA贡献1804条经验 获得超8个赞
我的解决方案
const elementDiv = document.querySelector('div');
const elementText = elementDiv.textContent.trim().split(/\s+/);
elementDiv.innerHTML = '';
elementText.forEach(element => {
elementDiv.innerHTML += `<br>${element.replace(/e/gi, '<span style="color: red;">e</span>')}`;
});
<div>
stephen
<p id="demo">peter</p>
ben
</div>
添加回答
举报
0/150
提交
取消