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

Question

问题

如何将 a 替换<为锚点作为 HTML 包装器？

背景

我得到一个带有 Twitter 用户名的 JSON 值，例如 <jgallardo949>

因为我不希望将其打印到页面上：

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

我引用了其他类似的问题，我可以在这里和其他地方找到。我从替换文本 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;

标签： javascript

Answer 1

>HTML 中的A会像>这样返回(\>|>)，它会同时找到两者。

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>