循环遍历字符串并动态插入属性vanilla js

时间:2018-05-23 17:15:53

标签: javascript

我循环播放一串HTML内容。

循环遍历所有标题并动态地注入其文本的id标记。

我在服务器端(nodejs)执行此操作,因此它限制了我可以使用或想要使用的内容而不添加任何额外的库只是为了做这件事。例如。 Jquery,domParser

有更有效的方法吗?所有在一个循环中?



let str = "<h1>abc</h1><h2>xyz</h2><h3>aaa</h3><h1>aaaaa</h1>";

if (str.match(/<h1>(.*?)<\/h1>/g) !== null) {
  const h1Arr = str.match(/<h1>(.*?)<\/h1>/g).map(val => {
    return val.replace(/<\/?h1>/g, '');
  });

  str = str.replace(/<h1>/g, function() {
    return `<h1 id="${h1Arr.shift().replace(" ", "_")}">`;
  });
}

if (str.match(/<h2>(.*?)<\/h2>/g) !== null) {
  const h2Arr = str.match(/<h2>(.*?)<\/h2>/g).map(val => {
    return val.replace(/<\/?h2>/g, '');
  });

  str = str.replace(/<h2>/g, function() {
    return `<h2 id="${h2Arr.shift().replace(" ", "_")}">`;
  });
}

if (str.match(/<h3>(.*?)<\/h3>/g) !== null) {
  const h3Arr = str.match(/<h3>(.*?)<\/h3>/g).map(val => {
    return val.replace(/<\/?h3>/g, '');
  });

  str = str.replace(/<h3>/g, function() {
    return `<h3 id="${h3Arr.shift().replace(" ", "_")}">`;
  });
}

console.log(str)
&#13;
&#13;
&#13;

0 个答案:

没有答案