如何在不影响文本的情况下删除 <a> </a> 标签?

How do I remove the <a> </a> tag without affecting the text?

我尝试将 <a> </a> 标签删除到许多 link 和 javascript 示例:

<a href="somelink.com/1"> content1
</a>
<a href="somelink.com/2"> content12
</a>
<a href="somelink.com/3"> content13
</a>
<a href="somelink.com/3"> content14
</a> ........ ect ...

以便在不影响文本的情况下保持这种方式::

content1
content2
content3
content4

我尝试用这段代码来做,但没有成功:

<script>
document.querySelectorAll('a[href^="somelink.com"]').forEach(
  x => a.href = "  "
)
</script>

感谢您的帮助

你改变它outerHTML to its innerHTML.代码如下

function removeTags(){
  document.querySelectorAll('a').forEach(a => {
    a.outerHTML = a.innerHTML
  })
  console.log(document.body.innerHTML)
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="somelink.com/1"> content1</a>
<a href="somelink.com/2"> content12</a>
<a href="somelink.com/3"> content13</a>
<a href="somelink.com/3"> content14</a>
<button onclick="removeTags()">Remove Tags</button>

因为你标记的是 JS 而不是 JQuery,所以我保留了所有内容 JavaScript。这将获得页面上的所有 <a> 标记,因此只有在您需要时才有效。只需将其添加到页面末尾即可。

<script>
//Get all the a tags on the page
var tags = document.getElementsByTagName("a");
for(var i = 0; i < tags.length; i++)
{
    //Remove the link
    tags[i].href = "";
}
</script>

这些是您显示的准确结果

function removeLinks(align=true){
 var links = document.querySelectorAll('a');
  links.forEach(function(item){
   item.href = "#";
    item.style.display="block";
    item.style.textDecoration='none';
    item.style.color='black';
  });
  
  if (align) {
  var counter = 1;
  links.forEach(function(item){
   item.innerHTML = (item.innerHTML).substr(0,8) + counter;
    counter++;
  })
  }
}
removeLinks(align=true);
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Link Remover</title>
</head>
<body>
  <a href="somelink.com/1"> content1
</a>
<a href="somelink.com/2"> content12
</a>
<a href="somelink.com/3"> content13
</a>
<a href="somelink.com/3"> content14
</a>
</body>
</html>