用相同的类(香草js)替换innerHTML中所有元素的两个字符

Question

如何在多个元素中替换两个字符?我已经找到了使用jquery的答案，但我正在寻找香草js。

我想把<换成&lt，把>换成&gt。

我自己试过，但它只替换了第一个符号。

let string = data.val().message;
string = string.replace("<", "&lt").replace(">", "&gt");
// <div>1</div> result was &ltdiv&gt1</div>

它只替换了第一个符号。

要替换符号的元素的类为.msgContent。

Answer 1

下面是如何使用正则表达式在VanillaJS中实现的。

var elems = document.querySelectorAll(".class");
elems.forEach(function (elem)
{
var msg = elem.innerHTML.replace(/</g,"&lt").replace(/>/g,"&gt");
elem.innerHTML = msg;
console.log(msg); // Just for illustration purpose
});

<div class="class">
<div>Some Meessage One</div>
</div>
<div class="class">
<div>Some Meessage Two</div>
</div>