javascript - 仅使用纯 javascript 将 <> 箭头替换为 HTML

Question

问题

如何替换 <用 anchor 作为 HTML 包装器？

背景

我得到一个 JSON 值，其中包含 Twitter 用户名，例如
<jgallardo949>


因为我不想把它打印到页面上:

• 我想替换 <与 <a
href="twitter.com/{{data.author}}">
• 和>与 </a>
• 代码中的最终结果将是 <a
href="twitter.com/jgallardo949">jgallardo949</a>
• 页面上的最终结果将是:jgallardo949

我引用了我能够在此处和其他地方找到的其他类似问题。我从 Replace string of text javascript 上的答案开始

我的后续练习奏效了。但特别是 >符号有问题，或者我遗漏了什么？

代码

前两个有效，最后一个无效

HTML

<div class="label">With Profits Financial Strength:</div>
<div class="data rating">****</div>
<div class="data2 thing">+</div>
<div class="author twitter"> > </div>

JS

var str=document.getElementsByClassName("data" ,"raiting")[0].innerHTML; 
var n=str.replace(/\*/g,"star");
document.getElementsByClassName("data", "raiting")[0].innerHTML=n;



var str2=document.getElementsByClassName("data2" ,"thing")[0].innerHTML; 
var n2=str2.replace(/\+/g,"<h1>moon</h1>");
document.getElementsByClassName("data2", "thing")[0].innerHTML=n2;


var str3=document.getElementsByClassName("author" ,"twitter")[0].innerHTML; 
var n2=str3.replace(/\>/g,"<h1>moon3</h1>");
document.getElementsByClassName("author", "twitter")[0].innerHTML=n2;

Answer 1

HTML 中的

> 返回为 > 所以这样做 (\>|>) 它会找到两者。

var n2=str3.replace(/(\>|&gt;)/g,"<h1>moon3</h1>");

堆栈片段

var str=document.getElementsByClassName("data" ,"raiting")[0].innerHTML; 
var n=str.replace(/\*/g,"star");
document.getElementsByClassName("data", "raiting")[0].innerHTML=n;



var str2=document.getElementsByClassName("data2" ,"thing")[0].innerHTML; 
var n2=str2.replace(/\+/g,"<h1>moon</h1>");
document.getElementsByClassName("data2", "thing")[0].innerHTML=n2;


var str3=document.getElementsByClassName("author" ,"twitter")[0].innerHTML; 
var n2=str3.replace(/(\>|&gt;)/g,"<h1>moon3</h1>");
document.getElementsByClassName("author", "twitter")[0].innerHTML=n2;

<div class="label">With Profits Financial Strength:</div>
<div class="data rating">****</div>
<div class="data2 thing">+</div>
<div class="author twitter"> > </div>