如何删除div标签下列出的href？

Question

我正在修改我的wordpress主题的一部分，但遇到了一个问题。 尽管我没有能力修改类名或设置ID标签，但我想取消单击链接的能力

HTML：

<div class="one">
  <a href="foobar.com">foobar.com</a>
</div>

我试图通过编写以下JavaScript来删除功能：

document.getElementsByClassName("one")
  .getElementsByTagName("a")
  .removeAttribute("href");

但是此方法不起作用，我做错了吗？

Answer 1

您可以使用CSS。

.one a {
    pointer-events: none;
  }

您还可以通过添加cursor: default;来删除手形cursor: default;

Answer 2

 document.getElementsByTagName("a")[0].removeAttribute("href"); 

 <div class="one"> <a href="foobar.com">foobar.com</a> </div> 

无需目标.one第一。 只是通过getElementsByTagName目标，但是请记住，这将返回一个元素数组，因此您需要引用要删除的元素的索引。

document.getElementsByTagName("a")[0].removeAttribute("href");

Answer 3

如果只需要选择“一个”类中的链接，则需要索引从getElementsByClass返回的内容，然后调用子代并对其进行索引：

document.getElementsByClassName("one")[0].children[0].removeAttribute("href")

Answer 4

您可以这样操作：

  document.getElementById("text").onclick = function(){ var clickStatus = true; // Change this to true if you want to enable the link. if (clickStatus){ window.location = "http://foobar.com"; } } 

 <div class="one"> <section id="text">foobar.com</section> </div> 

Answer 5

由于getElementsByClassName函数将返回一个节点列表而不是单个节点，因此将生成Type Error ，因此您需要执行以下操作：

document.getElementsByClassName("one")[0]
.getElementsByTagName("a")[0]
.removeAttribute("href");

要么

document.querySelector(".one a").removeAttribute("href");

以上任何一种方法都可以解决您的问题

希望对您有所帮助

Answer 6

我认为您需要在此处禁用Href功能。 请使用Jquery：

$('.one > a').on('click',function(e){    
  e.preventDefault();
}

希望这对你有用