Solved

Hide All Links On Page

Posted on 2008-06-19
11
604 Views
Last Modified: 2008-11-27
How can I hide all links on a page?

I know that it involves using...

document.getElementsByTagName("a")

Is there a way for the script to thoroughly search for, and hide all links no matter what a link's "class" or "id" is?

Thank you very much for your help!
0
Comment
Question by:ironsamurai
  • 5
  • 3
11 Comments
 
LVL 7

Accepted Solution

by:
ruscomp earned 250 total points
ID: 21825059
Maybe something like the following...
aLinks = document.getElementsByTagName("a");
var i=0;
for (i=0;i<=aLinks.len;i++)
{ 
aLinks[i].style.display="none";
}

Open in new window

0
 
LVL 7

Expert Comment

by:ruscomp
ID: 21825070
Or if you didn't want the element to collapse, you could use:

.style.visibility="hidden";
0
 

Author Comment

by:ironsamurai
ID: 21825503
Thanks, that's what I had in mind, but it doesn't seem to work.

Here's what I have so far:

<html>

<head>

<title>Test</title>

</head>

<body>

<script>

aLinks = document.getElementsByTagName("a");
var i=0;
for (i=0;i<=aLinks.len;i++)
{
aLinks[i].style.display="none";
}

</script>

<a href="#">Remove this link</a>

</body>

</html>



Also, is there a way for the script to search for all links if the actual script is below a link? For example:

<a href="#">Remove this link</a>

<script src="thescript.js" type="text/javascript"></script>


Thanks again!
0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 
LVL 7

Expert Comment

by:ruscomp
ID: 21825544
I beleive the script should always be after the links... javascript will fire off as it is encountered, so if it is at the top of the page (right below opening body tag or in the head tag), there are no links that exist yet... so it won't see them...

One option is create the script as a function, and then add it to the body onload event.

function hideLinks {
 aLinks = document.getElementsByTagName("a");
 var i=0;
 for (i=0;i<=aLinks.len;i++)
 {
 aLinks[i].style.display="none";
 }
}

And then in the body tag:
onload="hideLinks();"
0
 

Author Comment

by:ironsamurai
ID: 21825818
It still isn't working, here's what I have:


<html>

<head>

<title>Test</title>

</head>

<body onload="hideLinks();">

<a href="#">Remove this link</a>

<script>

function hideLinks {
 aLinks = document.getElementsByTagName("a");
 var i=0;
 for (i=0;i<=aLinks.len;i++)
 {
 aLinks[i].style.display="none";
 }
}

</script>

</body>

</html>


Any idea what's wrong?

Thanks!
0
 
LVL 7

Expert Comment

by:ruscomp
ID: 21825874
Is the browser showing any errors?
0
 

Author Comment

by:ironsamurai
ID: 21826982
Yeah, IE is saying "Object Expected" and Opera is saying "Syntax Error".
0
 
LVL 42

Assisted Solution

by:David S.
David S. earned 250 total points
ID: 21828821
I expect you mean the length property.

It's best to avoid using inline event handlers, especially on <body>.
function hideLinks() {
  var aLinks = document.getElementsByTagName("a");
  for(var i=0,k=aLinks.length; i<k; i++) { 
    aLinks[i].style.display="none";
  }
}
window.onload = function(){
  hideLinks();
}

Open in new window

0
 
LVL 7

Expert Comment

by:ruscomp
ID: 21830473
Woops, I do my best not to mix up languages :)  With .length it should be perfect...
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

792 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question