• 회원가입
  • 로그인
  • 구글아이디로 로그인

[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

 



분류 제목
Global JS - String() 함수 ★ - 객체값을 문자열로 변환 [전역함수]
Global JS - unescape() 함수 - 인코딩된 문자열을 디코딩. 1.5 버전에서 폐기예고. decodeUR…
Conversion JS - Type Conversion (타입변환 = 타입변경) ★
Conversion JS - false 타입변환 - (숫자: 0 , 문자열: "false" , 참거짓: false)
Conversion JS - true 타입변환 - (숫자: 1 , 문자열: "true" , 참거짓: true)
Conversion JS - 0 타입변환 - (숫자: 0 , 문자열: "0" , 참거짓: false)
Conversion JS - 1 타입변환 - (숫자: 1 , 문자열: "1" , 참거짓: true)
Conversion JS - "0" 타입변환 - (숫자: 0 , 문자열: "0" , 참거짓: true)
Conversion JS - "1" 타입변환 - (숫자: 1 , 문자열: "1" , 참거짓: true)
Conversion JS - NaN 타입변환 - (숫자: NaN , 문자열: "NaN" , 참거짓: false)
Conversion JS - Infinity 타입변환 - (숫자: Infinity , 문자열: "Infinity" , 참거짓: …
Conversion JS - -Infinity 타입변환 - (숫자: -Infinity , 문자열: "-Infinity" , 참거…
Conversion JS - "" 타입변환 - (숫자: 0 , 문자열: "" , 참거짓: false)
Conversion JS - "20" 타입변환 - (숫자: 20 , 문자열: "20" , 참거짓: true)
Conversion JS - "twenty" 타입변환 - (숫자: NaN , 문자열: "twenty" , 참거짓: true)
Conversion JS - [ ] 타입변환 - (숫자: 0 , 문자열: "" , 참거짓: true)
Conversion JS - [20] 타입변환 - (숫자: 20 , 문자열: "20" , 참거짓: true)
Conversion JS - [10,20] 타입변환 - (숫자: NaN , 문자열: "10,20" , 참거짓: true)
Conversion JS - ["twenty"] 타입변환 - (숫자: NaN , 문자열: "twenty" , 참거짓: true)
Conversion JS - ["ten","twenty"] 타입변환 - (숫자: NaN , 문자열: "ten,twenty" , …
19/67
목록
찾아주셔서 감사합니다. Since 2012