Question

我尝试使用JavaScript示例将<a> </a>标记删除为许多链接：

<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>

谢谢您的帮助

Answer 1

您将其outerHTML更改为其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>

Answer 2

当您标记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>

Answer 3

这些是您显示的确切结果

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>

如何删除<a> </a>标签而不影响文本？

3 个答案: