JavaScript로 현재 URL을 얻으시겠습니까?

내가 원하는 것은 웹 사이트 URL을 얻는 것입니다. 링크에서 가져온 URL이 아닙니다. 페이지 로딩에서 웹 사이트의 전체 현재 URL을 가져 와서 원하는대로 변수로 설정할 수 있어야합니다.

사용하다:

window.location.href 

주석에서 언급했듯이 아래 줄은 작동하지만 Firefox에서는 버그가 있습니다.

document.URL;

DOMString 유형의 URL, readonly를 참조하십시오 .

URL 정보 액세스

JavaScript는 브라우저의 주소 표시 줄에 표시되는 현재 URL을 검색하고 변경하는 많은 방법을 제공합니다. 이러한 모든 방법은 Location객체의 속성 인 Window객체를 사용합니다. Location다음과 같이 현재 URL이 있는 새 객체를 만들 수 있습니다 .

var currentLocation = window.location;

기본 URL 구조

<protocol>//<hostname>:<port>/<pathname><search><hash>

• protocol : 인터넷의 리소스에 액세스하는 데 사용되는 프로토콜 이름을 지정합니다. (HTTP (SSL 없음) 또는 HTTPS (SSL 있음))

• hostname : 호스트 이름은 리소스를 소유 한 호스트를 지정합니다. 예를 들면 다음과 같습니다 www.stackoverflow.com. 서버는 호스트 이름을 사용하여 서비스를 제공합니다.

• 포트 : 서버에 도착했을 때 인터넷 또는 기타 네트워크 메시지가 전달 될 특정 프로세스를 인식하는 데 사용되는 포트 번호입니다.

• 경로 이름 : 경로는 웹 클라이언트가 액세스하려는 호스트 내의 특정 리소스에 대한 정보를 제공합니다. 예를 들면 다음과 같습니다 /index.html.

• 검색 : 쿼리 문자열은 경로 구성 요소를 따르며 리소스가 검색을위한 매개 변수 또는 처리 할 데이터와 같은 특정 목적으로 활용할 수있는 정보 문자열을 제공합니다.

• 해시 : URL의 앵커 부분에는 해시 부호 (#)가 포함됩니다.

이러한 Location객체 속성을 사용하면 이러한 모든 URL 구성 요소와 구성하거나 반환 할 수있는 대상에 액세스 할 수 있습니다.

• href- 전체 URL
• protocol -URL의 프로토콜
• host -URL의 호스트 명과 포트
• hostname -URL의 호스트 명
• port- 서버가 URL에 사용하는 포트 번호
• pathname -URL의 경로명
• search -URL의 쿼리 부분
• 해시-URL 의 앵커 부분

나는 당신이 대답을 바랍니다 ..

를 사용하여 window.location받는 사람 읽기 및 쓰기 액세스를위한 위치 개체 현재 프레임과 연관된. 주소를 읽기 전용 문자열로 가져 오려면을 사용할 수 있습니다 . document.URL이와 동일한 값을 포함해야합니다 window.location.href.

현재 페이지 URL을 가져옵니다.

window.location.href

순수 JavaScript를 사용하면 현재 페이지 의 전체 URL 을 쉽게 얻을 수 있습니다. 예를 들어이 페이지에서이 코드를 사용해보십시오.

window.location.href;
// use it in the console of this page will return
// http://stackoverflow.com/questions/1034621/get-current-url-in-web-browser"

이 window.location.href속성은 현재 페이지의 URL을 반환합니다.

document.getElementById("root").innerHTML = "The full URL of this page is:<br>" + window.location.href;

<!DOCTYPE html>
<html>

<body>
  <h2>JavaScript</h2>
  <h3>The window.location.href</h3>
  <p id="root"></p>
</body>

</html>

이것들을 언급하는 것도 나쁘지 않습니다.

• 상대 경로가 필요한 경우 간단히 window.location.pathname;

• 호스트 이름을 얻으려면 window.location.hostname;

• 프로토콜을 별도로 가져와야 할 경우 window.location.protocol

  • 또한 페이지에 hash태그 가 있으면 다음 과 같이 얻을 수 있습니다 window.location.hash..

따라서 window.location.href한 번에 모든 것을 처리합니다 ... 기본적으로 :

window.location.protocol + '//' + window.location.hostname + window.location.pathname + window.location.hash === window.location.href;
    //true

또한 사용하여 window윈도우 범위 내에서 이미 경우 필요하지 않습니다 ...

따라서이 경우 다음을 사용할 수 있습니다.

location.protocol

location.hostname

location.pathname

location.hash

location.href

경로를 얻으려면 다음을 사용할 수 있습니다.

console.log('document.location', document.location.href);
console.log('location.pathname',  window.location.pathname); // Returns path only
console.log('location.href', window.location.href); // Returns full URL

개발자 도구를 열고 콘솔에 다음을 입력 하고 Enter를 누르 십시오 .

window.location

예 : 아래는 현재 페이지의 결과 스크린 샷입니다.

여기서 필요한 것을 잡아라. :)

사용하십시오 : window.location.href.

위에서 언급했듯이 document.URL 업데이트 할 때 업데이트 하지 않습니다window.location . MDN을 참조하십시오 .

• window.location.href완전한 URL을 얻는 데 사용하십시오 .
• window.location.pathname호스트를 떠나는 URL을 얻는 데 사용 합니다.

다음 을 사용하여 해시 태그 로 현재 URL 위치를 얻을 수 있습니다 .

자바 스크립트 :

 // Using href
 var URL = window.location.href;

 // Using path
 var URL = window.location.pathname;

jQuery :

$(location).attr('href');

var currentPageUrlIs = "";
if (typeof this.href != "undefined") {
       currentPageUrlIs = this.href.toString().toLowerCase(); 
}else{ 
       currentPageUrlIs = document.location.toString().toLowerCase();
}

위의 코드는 또한 누군가를 도울 수 있습니다

빠른 참조를위한 결과 추가

window.location;

 Location {href: "/programming/1034621/get-the-current-url-with-javascript",
 ancestorOrigins: DOMStringList,
 origin: "https://stackoverflow.com",
 replace: ƒ, assign: ƒ, …}

문서 위치

  Location {href: "/programming/1034621/get-the-current-url-with-javascript", 
ancestorOrigins: DOMStringList,
 origin: "https://stackoverflow.com",
 replace: ƒ, assign: ƒ
, …}

window.location.pathname

"/questions/1034621/get-the-current-url-with-javascript"

window.location.href

"/programming/1034621/get-the-current-url-with-javascript"

location.hostname

"stackoverflow.com"

쿼리 문자열이 포함 된 완전한 URL :

document.location.toString().toLowerCase();

호스트 URL의 경우 :

window.location

jstl에서는을 사용하여 현재 URL 경로에 액세스 할 수 있습니다 pageContext.request.contextPath. Ajax 호출을 수행하려면 다음 URL을 사용하십시오.

url = "${pageContext.request.contextPath}" + "/controller/path"

예 : 페이지의 http://stackoverflow.com/posts/36577223경우을 제공 http://stackoverflow.com/controller/path합니다.

현재 위치 객체를 얻는 방법은 window.location입니다.

이것을 document.location현재 URL 만 문자열로 반환 한와 비교하십시오 . 아마도 혼란을 피하기 위해 document.location로 대체되었습니다 document.URL.

그리고 모든 최신 브라우저는로 매핑 document.location됩니다 window.location.

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

실제 URL 객체를 원하는 경우 URL을 인수로 사용하는 유틸리티의 경우 :

const url = new URL(window.location.href)

https://developer.mozilla.org/en-US/docs/Web/API/URL

Nikhil Agrawal의 대답은 훌륭합니다. 콘솔에서 다른 구성 요소가 실제로 작동하는 것을 볼 수있는 작은 예제를 여기에 추가하면됩니다.

경로 또는 쿼리 매개 변수가없는 기본 URL (예 : 개발 / 스테이징 서버와 프로덕션 서버 모두에서 작동하기 위해 AJAX 요청을 수행하는 경우)을 원할 경우 window.location.origin프로토콜과 옵션 포트 (장고 개발)를 유지하는 것이 가장 좋습니다. 호스트 이름 등을 사용하면 비표준 포트가 손상됩니다.)

   location.origin+location.pathname+location.search+location.hash;

현재 페이지의 전체 링크를 통해 location.href 현재 컨트롤러의 링크를 얻으려면 다음을 사용하십시오.

location.href.substring(0, location.href.lastIndexOf('/'));

JavaScript로 현재 URL 얻기 :

• window.location.toString ();

• window.location.href

ID 가있는 특정 링크를 참조하는 경우이 코드가 도움이 될 수 있습니다.

$(".disapprove").click(function(){
    var id = $(this).attr("id");

    $.ajax({
        url: "<?php echo base_url('index.php/sample/page/"+id+"')?>",
        type: "post",
        success:function()
        {
            alert("The Request has been Disapproved");
            window.location.replace("http://localhost/sample/page/"+id+"");
        }
    });
});

여기서 ajax를 사용하여 ID를 제출하고 window.location.replace 사용하여 페이지를 리디렉션합니다 . id=""명시된대로 속성 을 추가하십시오 .

시험

location+''

let url = location+'';

console.log(url);

먼저 페이지가 완전히로드되었는지 확인

browser,window.location.toString();

window.location.href

그런 다음 URL, URL 변수를 가져 와서 콘솔에서 인쇄하는 함수를 호출하십시오.

$(window).load(function(){
   var url = window.location.href.toString();
   var URL = document.URL;
   var wayThreeUsingJQuery = $(location).attr('href');
   console.log(url);
   console.log(URL);
   console.log(wayThreeUsingJQuery );
});