23

I have some javascript code which, at one point, sets window.location.hash to a specific string. This works fine in Firefox 3, but I want to know if I will run into problems with this later, i.e. is this a cross-browser solution (IE6 included)?

Also, I am using ReallySimpleHistory. Will this mess up its internal state?

Thanks

Cameron
  • 96,106
  • 25
  • 196
  • 225

5 Answers5

25

window.location.hash has been around since JavaScript was introduced in Netscape Navigator 2 back in 1995. It was first supported by Microsoft in Internet Explorer 3 in 1996. I think you can be reasonably certain that every JS-capable browser supports it.

From a quick glance through the source, it looks as if ReallySimpleHistory makes pretty extensive use of this property, so you may well break it. You might want to use its add(newLocation) method instead (which works by setting window.location.hash).

NickFitz
  • 34,537
  • 8
  • 43
  • 40
  • Thanks. I was avoiding the add() method on purpose because I foolishly wanted to avoid setting a history point, but this turns out to be impossible – Cameron Aug 13 '09 at 06:15
15

Get:

 var hash = location.hash.slice(1);

Set:

 location.hash = '#' + 'string';
Web_Designer
  • 72,308
  • 93
  • 206
  • 262
Thinker
  • 14,234
  • 9
  • 40
  • 55
  • 5
    Why not just use the location.hash property? That's what it's for, and as it's been around since Netscape Navigator 2 (1995) you can bet it's supported everywhere. – NickFitz Aug 12 '09 at 10:46
  • 1
    I Updated the answer to use `location.hash` instead of `location.href`, and `.slice(1)` instead of `.split[1]` which is [more bulletproof](http://lea.verou.me/2011/05/get-your-hash-the-bulletproof-way/). – Web_Designer Feb 01 '13 at 22:46
  • 1
    Note, some browsers _require_ the preceding '#' when setting the hash. Simply setting `window.location.hash = 'foo'` will result in example.com/foo rather than example.com/#foo. – KeatsKelleher Apr 28 '15 at 17:32
13

Old thread i know, but window.location.hash is subject to a size limit as well. If you're passing large amounts of data, and want to save state in the hash, you could run into some issues.

IE will give you the error: SCRIPT5 - Access denied. if you try to assign a hash that is over the limit which is super useful.

Just food for thought.

ginman
  • 1,315
  • 10
  • 20
  • 1
    Thanks, very helpful. When trying to enter the url directly in the IE, if it is too long, it is "simply" cut... – GôTô Oct 03 '13 at 09:24
  • 1
    Awesome info. That is the issue I'm experiencing. – pseudosavant Feb 18 '15 at 01:14
  • Thanks! That was exactly our problem. Too bad that the error message gives so few details. First we searched a long time for the error in other places like the LocalStorage. – jannnik Jan 24 '20 at 09:41
4

All "modern" (a.k.a A-Graded) browsers allow to set hash and do not reload the page when doing so. The ones that do reload the page are some of the older ones, such as Safari 2.0.4 and Opera 8.5x.

See my Usenet post on comp.lang.javascript where I explain it in a bit more detail.

Also note, that HTML5 finally specifies that hash setter should change actual hash but not reload the page.

hippietrail
  • 15,848
  • 18
  • 99
  • 158
kangax
  • 38,898
  • 13
  • 99
  • 135
3

Setting window.location.hash works fine in IE6 & IE7.

In some occasions, reading window.location.hash under IE6 right after a set will return the old value, but the browser has set the hash successfully. An example:

alert(window.location.hash);
window.location.hash = '#newHash';

/* Sometimes, it will return the old value,
   I haven't figured out why it does that, and
   it's rather rare. */
alert(window.location.hash);

If you are just using it to set it, you shouldn't run into any problems.

Andrew Moore
  • 93,497
  • 30
  • 163
  • 175