js截取过长的字符串（js如何替换字符串中匹配到多处中某一指定节点）
js截取过长的字符串（js如何替换字符串中匹配到多处中某一指定节点）const str ="这是主体内容，有很多内容，喜欢看这个内容就关注吧"; const reg = new RegExp('内容' 'g'); let ret; const arr=[]; while((ret = reg.exec(str))!==null) { arr.push({id:ret.index content:ret.input}) } const replaceStr = (strs index text len) => { return strs.substring(0 index) text strs.substring(index len); }; // 替换文本的第三处“内容”为 “文章” const newV
抛出一个问题，如图，搜索关键字，匹配到四处，那我鼠标放在第二处，我想把它变个颜色，该怎么实现呢？回到文章的标题，js如何替换字符串中匹配到多处中某一指定节点？
字符串的替换，我们首先想到的一个属性是replace：
strObject.replace(reg/substr replacement)
两个参数，第一个参数，需要替换的值（可以是正则匹配式也可以是字符串），第二个参数，替换成的值。
str ="abcdefabdrdwss";
str.replace(/"ab"/g "xy");
console.log(str) // xycdefxydrdwss
当我们使用正则表达式，如上，加上g 就是全局匹配，不加就是匹配第一个。但是我就想替换第二处的ab。好像没有直接可用的api。那我们可不可以拿到第二处的下标位置，通过字符串截取拼接的方式实现呢？
顺着这个思路，如何找到第二处的下标位置。
let str ="abcdefabdrdwss";
const reg = new RegExp('ab' 'g');
let ret;
const arr=[];
while((ret = reg.exec(str))!==null) {
arr.push({id:ret.index content:ret.input}) // 通过循环把每次匹配的开始下标都放到arr中
}
console.log(arr) //[{id:0 content:"abcdefabdrdwss"} {id:6 content:"abcdefabdrdwss"}]
每处的下标都收集到了，再看如何替换。
// 字符串的替换，四个参数，第一个是原始字符串，第二个是替换的开始位置，第三是替换的内容
//第四个参数 这里是替换几位index就加几
const replaceStr = (strs index text len) => {
return strs.substring(0 index) text strs.substring(index len);
};
结合上面的内容，可以直接替换第二个"ab"了：
const newVal= replaceStr(str arr[1].id 'xy' 2);
console.log(newVal) // abcdefxydrdwss
附上完整的js代码示例：
const str ="这是主体内容，有很多内容，喜欢看这个内容就关注吧";
const reg = new RegExp('内容' 'g');
let ret;
const arr=[];
while((ret = reg.exec(str))!==null) {
arr.push({id:ret.index content:ret.input})
}
const replaceStr = (strs index text len) => {
return strs.substring(0 index) text strs.substring(index len);
};
// 替换文本的第三处“内容”为 “文章”
const newVal= replaceStr(str arr[2].id '文章' 2);
console.log(newVal) // 这是主体内容，有很多内容，喜欢看这个文章就关注吧
关注我，分享更多前端小知识！
