HTML 문서의 위치 객체 속성에 대한 이해와 일반적인 사용법_기본 지식

WBOY
풀어 주다: 2016-05-16 16:39:43
원래의
1705명이 탐색했습니다.

위치 객체에 대한 간단한 이해:

1. 위치 개체는 현재 페이지(이 페이지) 또는 더 직접적으로 현재 로드된 HTML 문서의 URL 정보를 포함합니다

2. 위치 개체는 창 개체의 속성이며 window.location을 통해 액세스할 수 있습니다

그럼 URL(리소스 로케이터)에 대한 몇 가지 정보를 소개하겠습니다.

브라우저에서 URL은 일반적으로 다음 부분으로 구성됩니다.

[프로토콜][호스트][경로][쿼리]

프로토콜: 일반적인 프로토콜은 다음과 같습니다.

http://는 리소스 파일이 웹 서버에 있음을 나타냅니다

ftp://는 리소스 파일이 네트워크의 FTP 서버에 있음을 나타냅니다

호스트: 호스트 이름 및 포트 번호(예: 로컬 Tomcat에서 일반적으로 사용하는 호스트: localhost:8080

경로 : 프로젝트의 경로 정보로, 주로 "/"와 문자로 구성되며, "/"는 상하관계

쿼리: 일반적으로 "?"로 시작하고 그 뒤에 일부 키-값 쌍(키=값)이 옵니다. 여러 키-값 쌍은 매개변수를 전달하는 데 사용할 수 있습니다. 서버 측에서는 백그라운드 작업, 데이터베이스 조건 쿼리, 양식 데이터 제출 등에 사용될 수 있으며 보안과 관련된 사항은 암호화하거나 다른 방법을 통해 여기에 제출할 수 있습니다. . . .

쿼리 뒤에 "#"으로 시작하는 매개변수를 추가할 수도 있지만 현재는 사용되지 않으므로 당분간 함부로 댓글은 달지 않겠습니다

위치 개체 속성:

1.href 속성: 프로토콜, 호스트 이름, 포트 번호, 쿼리 매개변수, #information 등을 포함한 현재 페이지의 전체 URL 정보가 모두 포함됩니다.

2.host 속성: 호스트 이름 및 포트 번호(예: localhost:8080 로컬 머신

3.호스트 이름: 호스트 이름

4.port: URL의 포트 번호

5.pathname: "/"가 포함된 URL의 경로 내용 부분

6.프로토콜:프로토콜

7.serach: "?"로 시작하는 쿼리 부분

8.hash: "#"으로 시작하는 콘텐츠

위치의 일반적인 사용법

분명히 개발자에게 편리한 속성 정보를 제공하는 것 외에도 더 중요하고 일반적인 용도도 있습니다

페이지 새로고침을 사용하여 문서 내용을 새로 고칠 수도 있지만 더 중요한 목적은 href 정보를 수정한 후 문서 내용을 다시 로드하는 것입니다

location.href: 할당 후 브라우저는 지정된 새 URL에 따라 문서의 내용을 새로 고칩니다.

location.reload(): 문서 새로고침

교차 도메인 페이지 문제 해결을 도와주세요:

1. 현재 페이지 새로고침

window.location.href =url//이 방법이 익숙합니다

self.location.href =url

location.href =url

위의 세 가지 방법을 모두 사용하여 현재 페이지를 새로 고칠 수 있습니다. (지정된 URL에 따라 다시 로드하면 현재 문서를 대체하는 또 다른 새로운 문서가 될 수 있습니다.)

2. 상위 페이지에서 하위 페이지를 포함하기 위해 iframe을 사용하는 경우

상위 페이지가 하위 페이지를 새로 고칩니다.

window.frames["id"].location.reload()//id는 페이지에 있는 iframe의 ID입니다

3. 하위 페이지는 상위 페이지를 새로 고칩니다.

parant.location.reload()

self.opener.location.reload()

방법은 여러 가지가 있는데, 앞으로도 실제 활용하면서 계속 정리해보겠습니다! ! ! !

기타 일반적인 방법:

location.replace() //현재 문서를 새 문서로 교체

location.sign() //새 문서 로드

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿