我从 API 服务获取 HTML 模板响应,因为有时我会获取链接,并且其 href 值为空字符串(但 insideText 有一些值), 任何人都可以帮助我,如果仅存在文本且 href 为空,如何隐藏 anchor 标记。 有时 HTML 响应会提供多个空链接,请给出隐藏所有空链接的解决方案。
<div class="hyper-btn">
<a href="" target="_blank"> User Profile </a>
</div>
最佳答案
要隐藏 anchor 标记,请使用CSS隐藏文档中的元素。
<!DOCTYPE html>
<html>
<style>
.hyper-btn a[href=""] {
display: none !important;
/* will hide all the empty anchor tags */
}
</style>
<body>
<div class="hyper-btn">
<a href="" target="_blank">Empty Link</a>
<a href="someAddress" target="_blank">Link to some Address</a>
</div>
</body>
</html>
要从 DOM 本身删除 anchor 标记,请添加以下 JavaScript
<!DOCTYPE html>
<html>
<body>
<div class="hyper-btn">
<a href="" target="_blank">Empty Link</a>
<a href="someAddress" target="_blank">Link to some Address</a>
</div>
<script>
const linkList = document.querySelectorAll('.hyper-btn a');
linkList.forEach(element => {
const targetURL = element.getAttribute('href');
if(!targetURL) {
element.remove(); // will be removed from DOM
}
});
</script>
</body>
</html>
关于html - 如果未提供目标地址且存在内部文本,则删除所有空 anchor 标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/73875801/