JavaScript에서 window.location과 document.location의 차이점은 무엇입니까?

241

둘 다 동일한 객체를 참조해야합니까?

javascript window.location

— 모건 Cheng
소스

1

차이점을 보여주는 사용 사례는 stackoverflow.com/a/12098898/632951

— Pacerier

220

W3C에 따르면 동일합니다. 실제로는 브라우저 간 안전을 위해을 (를) window.location대신 사용해야합니다 document.location.

참조 : http://www.w3.org/TR/html/browsers.html#dom-location

— 라훌
소스

12

공감. 모순 된 답변. 대담하게도 동일하다고 밝힌 다음 밝은 텍스트의 차이점을 설명합니다. 그것들은 결정적으로 동일하지 않습니다.

— danorton

33

C'mon 트리거 해피 다운 투표자는 조금 밝아집니다. 대부분의 경우, 그들은 라훌이 지정한 동굴을 유사하게 생각합니다. 의미 론적으로 그를 못 박자. 작은 필라델피아, 여러분 나는 그의 대답이 완전히 만족 스럽다는 것을 알았습니다. +1 (크리스토프의 대답이 받아 들여 져야하지만, 라훌의 대답은 받아 들여질 수있다-최소한

— 공감할

7

window.location정당성을 제공하지 않고 모범 사례를 추천 (항상 사용 )하는 경우 -1 정당성을 제공하지 않으면 왜 조언을 받아야합니까? Christoph의 답변은 이와 관련하여 훨씬 더 유용합니다.

— Mark Amery

+1이지만 Phil Hamer와 Christoph의 답변을 아래에서 확인하십시오. 문제를 완전히 이해하기 위해 필수 배경 정보와 경고를 추가합니다.

— Jon z

당신이 다음 방금 document.location에와 있지만에서는 window.location이 할 수있는 자식 프레임에서 샌드 박스 프레임에 탐색을 수행하려는 경우 사실은 내가 예를 들어 둘 사이의 차이를, 알

— M.Abulsoud

207

현재 위치 객체를 얻는 정식 방법 은 1996 년의이 MSDN 페이지 와 2006 년의 W3C 초안을window.location 참조하십시오 .

이것을 document.location현재 URL 만 문자열로 반환 한와 비교하십시오 ( MSDN의이 페이지 참조 ). 혼동을 피하기 위해 아마도 DOM Level 1의 일부인 ( MSDN 참조) document.location로 대체되었습니다 .document.URL

지금까지 내가 아는 한, 모든 최신 브라우저는지도 document.location에 window.location,하지만, 난 여전히 선호 window.location그게 내가 처음 DHTML을 쓴 이후로 사용한 적이 무엇으로.

— 크리스토프
소스

1

당신이 사용하는 경우 window.location, 그냥 사용하는 것이 동일하게 유효하지 location않습니까?

— commonpike

2

@commonpike 그것은 적어도 정의 된 모든 변수가 속성이되는 전역 객체 인 HTML 문서의 스크립트 컨텍스트에서 window객체이다. 따라서 스크립트의 최상위 수준에서 정의한 모든 변수 또는 함수는로 참조되는 객체의 속성이며 window이는 전역 객체입니다. 때와 같은 결석 글로벌 객체는 암시 window.하여 - location으로 해석됩니다 window.location. 주의 사항- if(an_undefined_variable)변수가 정의되지 않은 경우 fe 에서 오류가 발생합니다 if(window.an_undefined_variable).

— amn

92

window.location 은 모든 호환 브라우저에서 읽기 / 쓰기입니다.

document.location 은 Internet Explorer에서 최소한 읽기 전용이지만 Gecko 기반 브라우저 (Firefox, SeaMonkey)에서는 읽기 / 쓰기가 가능합니다.

— 프레데릭 하 미디
소스

10

document.locationIE에서 읽기 전용 인 클레임을 재현 할 수 없습니다 . IE 10, 9, 8 및 6에서 modern.ie의 VM을 사용하여 성공적으로 할당 할 수 있습니다 .

— Mark Amery

에 대한 의견 console.log(location);? !!

— Fr0zenFyr

44

document.locationGecko 브라우저를 사용하여 할당 할 수도 있지만 원래는 읽기 전용 속성이었습니다 . 브라우저 간 안전을 위해 window.location대신 사용하십시오.

더 읽어보기 :

document.location

window.location

— 디 에코
소스

언제 그것들을 사용할

— 것인지에

37

흥미롭게도 'location'이라는 프레임, 이미지 또는 양식이있는 경우 'document.location'은 Location 객체 대신 프레임 창, 이미지 또는 양식에 대한 참조를 각각 제공합니다. 분명히 document.forms, document.images 및 window.frames 컬렉션 이름 조회가 window.location에 대한 매핑보다 우선하기 때문입니다.

<img name='location' src='location.png'>

if (document.location.tagName == 'IMG') alert('Hello!')

— 필 해머
소스

2

우선 순위는 없으며 단순히 덮어 쓰기

— Pacerier

7

아니요, 덮어 쓰지 않습니다. 그림자로 표시되어 있으므로 Phil은 속성 확인 중에 요소가 우선합니다.

— kangax

@ kangax, 당신이 옳은 것 같습니다 : jsfiddle.net/uL4ysszr . 그러나이 행동은 얼마나 신뢰할 만합니까? 충분히 크로스 브라우저입니까?

— Pacerier

1

방금 이것을 테스트했습니다 (2016 년 10 월). 그것은 그 표시 window.location와 document.location크롬이나 파이어 폭스에 그림자 수 없습니다.

— Mr. Llama

1

@ Mr.Llama 당신이 맞아요. 모든 최신 브라우저가 더 이상 위에서 설명한 방식으로 작동하지 않는 것 같습니다. document.location에 "Unforgeable"속성을 제공 한 것으로 보입니다. 관련 Chromium 변경 : src.chromium.org/viewvc/blink?view=revision&revision=189862 그리고 Firefox 버그 : bugzilla.mozilla.org/show_bug.cgi?id=1133760

— Phil Hamer

27

내가 아는 한, 둘 다 동일합니다. 크로스 브라우저 안전을 위해 window.location대신 사용할 수 있습니다 document.location.

모든 최신 브라우저는지도 document.location에 window.location,하지만, 난 여전히 선호 window.location그것이 내가 처음으로 웹 페이지를 쓴 이후로 사용한 적이 무엇으로. 더 일관성이 있습니다.

또한 document.location === window.locationreturns 를 볼 수 있으며 true, 이는 둘 다 동일하다는 것을 명확하게합니다.

— 알파 남성
소스

14

document.location === window.location 보고 true

또한

document.location.constructor === window.location.constructor 이다 true

참고 : Firefox 3.6, Opera 10 및 IE6에서 방금 테스트했습니다.

— 당신
소스

1

@Pacerier 왜? 객체의 경우 ===와 ==동일합니다.

— Mark Amery

4

@MarkAmery, 그건 틀렸고 쉽게 설명 할 수 있습니다 : "abc" == new String("abc")returns truewhile "abc" === new String("abc")returns false.

— Pacerier

7

비교했을 때 : 좋아 @Pacerier, 내가 그 약간 더 엄격하고 덜 모호하게 언급하자 두 개체를 (오히려 아무것도 단지 개체 이상) 서로, ==그리고 ===동일합니다. 사양 섹션 11.9.3 및 11.9.6을 참조하십시오 . 비 - 널 들어 비 정의되지 않은 수의 비 BOOL는 동일한 유형의 문자열이 아닌 값은, ==문제가 11.9.3 파트 1 층에 의해 지배된다 ===동일 판독 11.9.6 부 (7)에 의해 동작이 돌아 true한다면 x와 y는 같은 객체를 나타냅니다. 그렇지 않으면를 반환하십시오 false.

— Mark Amery

10

@MarkAmery는,이 모두가 보장하지 않습니다 document.location및 window.location객체를 가리키는. 트리플 이퀄라이제이션의 요점이 빠졌습니다. 2 equals를 사용 한다고해서 동일한 obj 임을 증명할 수 는 없습니다 . 2가 같으면 거짓 긍정을주기 때문에 3은 같고 2는 같지 않아야합니다. document.location에이 URL 문자열입니다함으로써 브라우저에서 동일 window.location.toString(), 그리고 document.location==window.location진정한 동안을 반환 document.location===window.locationfalse를 돌려줍니다.

— Pacerier

@Pacerier Aha-나는 마침내 그것을 얻는다. 적어도 document.location === window.location비교가 되는 한 당신은 꽤 정확합니다 . 사실 .constructor비교가 너무 수단에서 발생되고,이 대답은 여전히 소리라고 생각하지만, 사용하는 ===추론을 단순화한다.

— Mark Amery

11

예, 동일합니다. 브라우저 JS API의 많은 역사적 단점 중 하나입니다. 시도해보십시오 :

window.location === document.location

— 매튜 플라 첸
소스

8

window.location은 오래된 브라우저를 고려할 때 두 가지보다 더 안정적입니다.

— 데이브 워드
소스

3

html 5는 더 이상 프레임 세트를 지원하지 않기 때문에 요즘의 차이점을보기는 어렵습니다. 그러나 프레임 셋이있을 때, document.location은 코드가 실행되는 프레임 만 리디렉션하고 window.location은 전체 페이지를 리디렉션합니다.

— 마퀸 호 펠리
소스

2

나는 window.location현재 URL 을 얻는 더 안정적인 방법 이라고 말할 것이다 . 다음은 URL에 해시 매개 변수를 추가하고 나중에 읽는 시나리오 중 하나에서 window.location와 의 차이점 document.url입니다.

URL에 해시 매개 변수를 추가 한 후

이전 브라우저에서는을 사용하여 URL에서 해시 매개 변수를 얻을 수 document.url없었지만 사용 window.location하면 URL에서 해시 매개 변수를 얻을 수있었습니다.

따라서 항상 사용하는 것이 좋습니다 window.location.

— 아즈 하르 살티
소스

1

-1. 질문은 언급조차하지 않았습니다 document.URL- window.location그리고 에 관한 것 document.location입니다. 또한 document.url존재하지 않습니다 = 대문자 여야합니다.

— Mark Amery

2

document.location.constructor === window.location.constructor입니다 true.

에서 볼 수있는 것과 정확히 동일한 객체이기 때문입니다 document.location===window.location.

따라서 생성자 또는 다른 속성을 비교할 필요가 없습니다.

— 진 카라 세프
소스

2

적어도 IE에서는 로컬 파일에 약간의 차이가 있습니다.

document.URL은 "file : // C : \ projects \ abc \ a.html"을 반환합니다.

그러나 window.location.href는 "file : /// C : /projects/abc/a.html"을 반환합니다

하나는 백 슬래시이고 다른 하나는 슬래시입니다.

— 저스틴
소스

2

그래, 그들은 동일하지만 ....!

window.location 일부 Internet Explorer 브라우저에서 작동하지 않습니다.

— divHelper11
소스

0

여기에서 권장하는 대부분의 사람들이 있음에도 불구하고 Google 애널리틱스 의 동적 프로토콜이 최근에 ga.js에서 analytics.js로 이동하기 전의 모습과 비슷합니다.

ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

추가 정보 : https://developers.google.com/analytics/devguides/collection/gajs/

새 버전에서는 브라우저가 자동으로 프로토콜을 추가 할 수 있도록 '//'를 사용했습니다.

'//www.google-analytics.com/analytics.js'

따라서 Google 이 JS에서 프로토콜이 필요할 때 document.location 을 선호 하는 window.location경우 몇 가지 이유가 있다고 생각합니다.

전반적인 : 나는 개인적으로 그렇게 생각 document.location하고 window.location있는 동일하지만, 같은 브라우저의 사용에 대한 가장 큰 통계와 거대한 경우 구글이 사용 document.location에를 , 나는 그들을 따라하는 것이 좋습니다.

— 카이 낙스
소스

2

그러나 이것은 매우 오래된 질문이며 귀하의 답변이 하나가 다른 것보다 낫다는 새롭거나 귀중한 증거를 제공하지 않기 때문일 수 있습니다. 또는 귀하의 답변이 Google이 역사적으로 한 일에 대한 가치에 상관없이 여론의 반대를 암시하기 때문일 수 있습니다. 또는 다운 보터가 실제로 강조 할 필요가없는 답변 부분을 강조하는 방식을 좋아하지 않았을 수도 있습니다. 정말 아무것도 될 수 있습니다. SO에 대한 익명 투표의 아름다움입니다.

— M.Babcock

0

실제로 둘 사이의 크롬 차이가 있음을 알 수 있습니다. 예를 들어 자식 프레임에서 샌드 박스 프레임으로 탐색하려면 window.location이 아닌 document.location 으로이 작업을 수행 할 수 있습니다.

— M.Abulsoud
소스