Wat is het verschil tussen document.location.href en document.location?

Wat is het verschil tussen document.location.hrefen document.location?

Is het hetzelfde in alle browsers?


Antwoord 1, autoriteit 100%

document.locationis een synoniem voor window.locationdat al bijna net zo lang is verouderd als JavaScript bestaat. Gebruik het niet.

locationis een gestructureerd object, met eigenschappen die overeenkomen met de delen van de URL. location.hrefis de hele URL in een enkele string. Het toewijzen van een tekenreeks aan een van beide is gedefinieerd om dezelfde soort navigatie te veroorzaken, dus maak uw keuze.

Ik beschouw het schrijven naar location.href = somethingiets beter omdat het iets explicieter is over wat het doet. Over het algemeen wil je gewoon location = somethingvermijden, omdat het er misleidend uitziet als een variabele toewijzing. window.location = somethingis echter in orde.


Antwoord 2, autoriteit 41%

De document.locationis een object dat eigenschappen bevat voor de huidige locatie.

De eigenschap hrefis een van deze eigenschappen, die de volledige URL bevat, d.w.z. alle andere eigenschappen bij elkaar.

In sommige browsers kunt u een URL toewijzen aan het object locationen doen alsof u deze aan de eigenschap hreftoewijst. Sommige andere browsers zijn kieskeuriger en vereisen dat u de eigenschap hrefgebruikt. Om de code dus in alle browsers te laten werken, moet u de eigenschap hrefgebruiken.

Zowel het windowals het documentobject heeft een locationobject. U kunt de URL instellen met behulp van window.location.hrefof document.location.href. Logischerwijs moet het object document.locationechter alleen-lezen zijn (omdat u de URL van een document niet kunt wijzigen; als u de URL wijzigt, wordt een nieuw document geladen), dus voor de zekerheid moet u gebruik liever window.location.hrefwanneer u de URL wilt instellen.


Antwoord 3, autoriteit 17%

typeof document.location; // 'object'
typeof document.location.href; // 'string'

De eigenschap hrefis een tekenreeks, terwijl document.locationzelf een object is.


Antwoord 4, autoriteit 7%

document.locationis een object, terwijl document.location.hrefeen string is. Maar de eerste heeft een toString-methode, dus je kunt ervan lezen alsof het een tekenreeks is en dezelfde waarde krijgen als document.location.href.

In sommige browsers – de meeste moderne denk ik – kun je ook toewijzen aan document.locationalsof het een string is. Volgens de Mozilla-documentatieis het echter beter om het window.locationvoor dit doel aangezien document.locationoorspronkelijk alleen-lezen was en dus mogelijk niet zo breed wordt ondersteund.


Antwoord 5, autoriteit 4%

document.location is verouderd ten gunste van window.location, dat alleen toegankelijk is via locatie, aangezien het een globaal object is.

Het locatieobject heeft meerdere eigenschappen en methoden. Als je het als een string probeert te gebruiken, werkt het als location.href.


Antwoord 6, autoriteit 4%

Vanaf 14 juni 2013(HTML5) is er een significant verschil

Browser : Chrome 27.X.X

Referenties: document.location, window.location( MDN)


document.locatie

type: Object

Als het object door zichzelf document.locationwordt aangeroepen, retourneert het zijn origin+ pathnameaaneengeschakelde eigenschappen.

Om alleen de URL als tekenreeks op te halen, kan de alleen-lezen eigenschap document.URLworden gebruikt.

ancestorOrigins: DOMStringList
assign: function () { [native code] }
hash: ""
host: "stackoverflow.com"
hostname: "stackoverflow.com"
href: "http://stackoverflow.com/questions/2652816/what-is-the-difference-between-document-location-href-and-document-location?rq=1"
origin: "http://stackoverflow.com"
pathname: "/questions/2652816/what-is-the-difference-between-document-location-href-and-document-location"
port: ""
protocol: "http:"
reload: function () { [native code] }
replace: function () { [native code] }
search: "?rq=1"
toString: function toString() { [native code] }
valueOf: function valueOf() { [native code] }

document.location.href

type: string

http://stackoverflow.com/questions/2652816/what-is-the-difference-between-document-location-href-and-document-location?rq=1

Antwoord 7

Hier is een voorbeeld van de praktische betekenis van het verschil en hoe het je kan bijten als je het niet beseft (document.location is een object en document.location.href is een string):

We gebruiken de gratis versie van MonoX Social CMS (http://mono-software.com) op http://social.ClipFlair.neten we wilden op sommige pagina’s de taalbalk WebPart toevoegen om ze te lokaliseren, maar op sommige anderen (bijvoorbeeld bij discussies) wilden we geen lokalisatie gebruiken. Dus we hebben twee hoofdpagina’s gemaakt om te gebruiken op al onze .aspx (ASP.net) pagina’s, in de eerste hadden we de taalbalk WebPart en de andere had het volgende script om de /lng/el-GR etc. te verwijderen van de URL’s en tonen in plaats daarvan de standaardtaal (Engels in ons geval) voor die pagina’s

<script>
  var curAddr = document.location; //MISTAKE
  var newAddr = curAddr.replace(new RegExp("/lng/[a-z]{2}-[A-Z]{2}", "gi"), "");
  if (curAddr != newAddr)
    document.location = newAddr;
</script>

Maar deze code werkt niet, vervang functie retourneert gewoon Undefined (geen uitzondering gegenereerd), dus het probeert te navigeren naar x/lng/el-GR/undefined in plaats van naar url x te gaan. Toen ik het uitprobeerde met Mozilla Firefox’ debugger (F12-toets) en de cursor over de curAddr-variabele bewoog, toonde het veel informatie in plaats van een eenvoudige tekenreekswaarde voor de URL. Door Watch te selecteren in die pop-up die je kon zien in het horlogevenster, werd “Locatie -> …” geschreven in plaats van “…” voor de url. Dat deed me beseffen dat het een object was

Men zou verwachten dat Vervangen een uitzondering of zoiets gooit, maar nu ik eraan denk dat het probleem was dat het probeerde wat niet-bestaande “vervangen” -methode op het URL-object te bellen dat gewoon terugkomt ” undefined “in JavaScript.

De juiste code in dat geval is:

<script>
  var curAddr = document.location.href; //CORRECT
  var newAddr = curAddr.replace(new RegExp("/lng/[a-z]{2}-[A-Z]{2}", "gi"), "");
  if (curAddr != newAddr)
    document.location = newAddr;
</script>

Other episodes