JavaScript

[Global] JS - encodeURIComponent() 함수 ★ - URI 구성요소(공백,특수문자,한글)를 URL에 사용가능한 문자로 인코딩 [전역함수] (= encodeURIComponent함수 = 인코드유알아이컴포넌트함수)

목차
  1. encodeURIComponent() 예제 - URI 구성요소 인코딩
  2. encodeURIComponent() 정의
  3. encodeURIComponent() 구문

 

encodeURIComponent() 예제 - URI 구성요소 인코딩 

 

<button onclick="homzzang()">클릭</button>


<p id="demo"></p>


<script>

function homzzang() {

  var uri = "https://homzzang.com/b/js-359";

  var res = encodeURIComponent(uri);

  document.getElementById("demo").innerHTML = res;

}

</script>

 

결과보기

결과값: https%3A%2F%2Fhomzzang.com%2Fb%2Fjs-359

 

encodeURIComponent() 정의

 

URI 구성요소 (특수문자, 공백, 한글)등을 URL에 사용 가능하게 인코딩.

 


 

1. 인코딩되는 특수문자 종류 (=  URL에 사용 불가능한 특수문자 종류)

  • , / ? : @ & = + $ #

 

2. encodeURIComponent() 함수를 꼭 사용해야만 하는 이유

  • 검색어를 URL에 바로 사용 시, "공백, 특수문자, 한글" 등의 문자가 URL에서 유효한 문자가 아닌 것으로 간주되어 검색 결과 제대로 표시  X.
  • 검색어를 URL에 바로 사용 시, 안전하지 않으며 보안 문제 초래.


3.

모든 브라우저 지원.


 

encodeURIComponent() 구문

 

encodeURIComponent(uri)

 


[매개변수]

 

uri

필수. 인코딩 할 URI

  • 예: https://homzzang.com/b/js-359

 


[반환값]

 

인코딩 된 URI 문자열 반환. 

  • 예: https%3A%2F%2Fhomzzang.com%2Fb%2Fjs-359

 



분류 제목
Date JS - toTimeString() 메서드 - 시간문자열 (예: 14:53:38 GMT+0900 (한국 표준…
Date JS - toUTCString() 메서드 ★ - 세계표준시날짜문자열 (예: Thu, 01 Aug 2019 0…
Date JS - UTC() 메서드 - 타임스탬프 (예: 1567209600000)
Date JS - valueOf() 메서드 - 객체값 (날짜자체 = valueOf메서드 = 밸류어브) (예: 1564…
Array JS - Array - 배열 ★★★★★
Array JS - constructor 속성(배열) - 배열 프로토타입 생성하는 함수를 반환. (constructor…
Array JS - length 속성 - 배열길이 (= 배열개수 = 배열값개수 = 배열요소개수 = length속성 = …
Array JS - Array.prototype 속성(배열) - 사용자정의 속성/메서드 추가 (= Array.proto…
Array JS - concat() 메서드 - 배열결합 (= 배열합치기 = concat메서드 = 컨캣메서드/컨켓메서드)
Array JS - copyWithin() 메서드 - 배열내 배열값 복사하기 (= copyWithin메서드 = 카피위딘…
Array JS - every() 메서드 - 모든배열값 함수충족여부 체크 (= every메서드 = 에브리메서드) ※ 모…
Array JS - fill() 메서드 - 배열값변경 (= 배열값교체 = 배열값바꾸기 = fill메서드 = 필메서드) …
Array JS - filter() 메서드 - 함수조건충족 배열값 구하기 (= filter메서드 = 필터메서드) ※ 배…
Array JS - find() 메서드 - 맨처음 조건 충족한 배열값 찾기 (= find메서드 = 파인드메서드)
Array JS - findIndex() 메서드 - 맨처음 조건 충족/일치 배열값 색인번호 찾기 (= findIndex…
18/89
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티 2
웹유틸
회원센터
홈짱닷컴 PC버전 로그인