隐藏/动态显示锚点

Question

我有一个锚点标记。我想要动态地隐藏/显示它。出于某种原因，我无法将其放入div/span中。我该怎么做？

Answer 1

一旦你为锚标记上的DOM元素的引用，这样做：

// Hide 
element.style.display = "none"; 

// Show again 
element.style.display = ""; 

有几种方法你会得到该引用。举例来说，如果锚固装置具有id，您可以使用getElementById：

HTML：

<a href='whatever' id='foo'>Whatever</a> 

的JavaScript：

element = document.getElementById('foo'); 

如果锚没有一个ID而你不知道无论出于何种原因，都想添加一个，您可以使用其他信息来识别正确的元素。这很容易通过一个库，如jQuery,Prototype,YUI,Closure或any of several others这样的库来实现，它可以让您使用CSS选择器来查找有问题的锚点。如果没有库，您必须依赖少量受到良好支持的DOM函数或处理浏览器变体，这是库帮助您避免的。

这里是通过页面上的锚的所有循环和基于隐藏一个的例子（live copy）其href：

HTML：

<a href='http://stackoverflow.com'>StackOverflow</a> 
<a href='http://superuser.com'>SuperUser</a> 
<a href='http://serverfault.com'>ServerFault</a> 

的JavaScript：

var links, index, link; 

links = document.getElementsByTagName('a'); 
for (index = 0; index < links.length; ++index) { 
    link = links[index]; 
    if (link.href.indexOf('superuser') >= 0) { 
    link.style.display = "none"; 
    break; 
    } 
} 

如果您使用库，会变得更加容易。举例来说，这里是一个jQuery版本的它（live copy）：

$('a[href*=superuser]').hide(); 

这里的原型版本（live copy）：

$$('a[href*=superuser]').invoke('hide');