what does <a href="#"> do?
Looking at the HTML I noticed that the Slide is actually a link, linking to “#”. What does that mean? Why do you need that? Couldn’t you just use <span> instead?
Answer 519460c4e22d049041001569
The ‘hash’ (#) in an href attribute denotes a page fragment. #myfragment = fragment identifier that goes hand in hand with id=”myfragment”. When it is used by itself, it denotes an empty fragment, which is the page itself. It’s the way many developers create anchors that don’t link to anything.
In usability terms, it can cause a jump in the page (since it scrolls to the top of the document) and is actually discouraged. Nowadays we see less of this sort of use since most pages are driven by some form of DOM script.
The most typical use of this syntax is in example code where there is no specific URL but the developer wants the tag to behave like a normal anchor element (so that pseudo selectors can be hooked).
When we have events registered, we can remove the href attribute altogether, but leave the anchor tag and other attributes it may carry, such as title, id, etc. The script can listen for events on these elements, without having to rely on HTML behavior (of a normal href link).
In lots of pages you’ll come across href=”javascript: void(0);” or something of this sort which is the preferred approach to “#” since it does not cause the page to scroll. The link is ignored as it identifies nothing.
5 comments
I see. Thanks a lot for your detailed explanation!
You say this, href=”#”, is old code. Is this why on my lesson it does not work? If I leave it in and click the tag it vanishes and will not pass, but when I delete it or replace it with the code you give, href=”javascript: void(0);”, it works.
I neglected to include AJAX in the previous post, where in many instances the hash is used in XML_HTTP_REQUEST’s. AJAX affords updates to only parts of a page, without reloading the page. This crosses over to DOM script driving our page, so didn’t really bear mentioning, earlier.
@Scott Janicki, I don’t have an answer to your question, though it could have something to do with the above? As we can see, there are two interpretations afoot if HTML and JS are both on the scene. JS uses document tree selection to hook elements (such as those with id attributes) so doesn’t tackle page fragments the way HTML does. The HTML behavior is as old as the id attribute in the HTML spec, and old or not, is just as valid today as any time before. If you can imagine it now, the earliest way to reference page fragments was the anchor tag with a unique name attribute value. This was horribly messy. Only thing was that nobody said JS shouldn’t have some sway over #, hence it got adopted into AJAX without hesitation. Still, not an answer to your question.
Thank you for your help. Reading other posts it also seems that it may be a problem with href=# and Firefox. Not sure but now have some knowledge of where to start to look if thing don’t work.
Popular free courses
- In this SQL course, you'll learn how to manage large datasets and analyze real data using the standard data management language.
- Beginner Friendly.4 Lessons
- Learn how to use JavaScript — a powerful and flexible programming language for adding website interactivity.
- Beginner Friendly.11 Lessons
- Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.
- Beginner Friendly.6 Lessons
