Question

我需要用字符串中的Sampler标签替换所有<a>。

代码：

<span>

但这对我不起作用，我也无法添加样式

输入： Angular是一个用于构建移动和桌面Web应用程序的平台。
var a = input.replace(/<a>/g, "'<span>"); var b = a.replace(/<\/a>/g, "</span>"); var c = b.replace(/href/g, "title");通过Web Workers和服务器端渲染，在当今的Web平台上实现可能的最大速度，并进一步提高速度。
<a href="http://www.google.com">Test Link</a>

输出： Angular是一个用于构建移动和桌面Web应用程序的平台。
<a href="http://www.google.com">Test Link Two</a>通过Web Workers和服务器端渲染，在当今的Web平台上实现可能的最大速度，并进一步提高速度。
<span style="color:#0000EE" title="http://www.google.com">Test Link</span>。

谁能帮我解决这个问题。

Answer 1

正如我在上面的评论中提到的，正则表达式不是处理（即解析，修改...）HTML的正确工具。这是一个示例，展示了使用DOMParser()来用新创建的跨度实际替换链接标签的方法。

var inputString = `Angular is a platform for building mobile and desktop web applications.
<a href="http://www.google.com">Test Link</a> Achieve the maximum speed possible on the Web Platform today, and take it further, via Web Workers and server-side rendering.
<a href="http://www.google.com">Test Link Two</a>`;

var domParser = new DOMParser();
var doc = domParser.parseFromString(inputString, 'text/html');
var links = doc.querySelectorAll('a:link');
links.forEach(function(linkTag) {
  var spanTag = document.createElement('span');
  spanTag.title = linkTag.href;
  spanTag.style.color = '#0000EE';
  spanTag.innerHTML = linkTag.innerHTML;
  linkTag.parentNode.replaceChild(spanTag, linkTag);
});
console.log(doc.body.innerHTML);

用字符串中的<span>标记替换所有<a>：Javascript

1 个答案: