javascript 특정 문자 사이의 문자열 추출하기(유튜브 영상 id 가져오기) 문자열 자르기 (indexOf, substr, substring, slice)

 

iframe으로 유튜브 영상을 가져올 때, 영상의 아이디 부분만 추출하고 싶었다.

 

<iframe src="https://www.youtube.com/embed/z-FGKPVGv9s?si=MFYVkIBVyK_fdwLc"></iframe>

var video_attr = $('iframe').attr('src');

var id_start = video_attr.indexOf('embed/') +6;
var id_end = video_attr.indexOf('?');


var id = video_attr.substring(id_start, id_end);

 

 

 

 

➜ 문자열에 특정 문자열 찾기 (indexOf)

 

indexOf(시작점, 위치)

var str = '자바스크립트';

//결과:'0'
var indexOf1 = str.indexOf('자');

//결과:'1'
var indexOf1 = str.indexOf('바');

//결과:'2'
var indexOf1 = str.indexOf('스');

//결과:'3'
var indexOf1 = str.indexOf('크');

//결과:'4'
var indexOf1 = str.indexOf('립');

//결과:'5'
var indexOf1 = str.indexOf('트');



//결과:'3'
var indexOf1 = str.indexOf('자바', 2);

//결과:'3'
var indexOf1 = str.indexOf('스', 1);

indexOf 함수는, 문자열에서 특정 문자열을 찾고, 이 특정 문자열의 index를 0으로 가지는 문자열의 원래 index값을 리턴한다.

 

 

 

 

 

➜ 문자열을 자르는 세가지 방법 (substr, substring, slice)

 

str.substr(start, [length]);
str.substring(indexStart, [indexEnd]);
str.slice(beginIndex, [endIndex]);

 

 

substr(시작위치, 길이)

var str = '자바스크립트';

//처음부터 두개 추출 (결과:'자바')
var substr1 = str.substr(0, 2);

//세번째부터 네개 추출 (결과:'스크립트')
var substr2 = str.substr(2, 4);

//세번째부터 끝까지 추출 (결과:'스크립트')
var substr3 = str.substr(2);

"length" 부분을 생략하면 시작 위치부터 문자열 끝까지 자른다.

문자열	자  바  스  크  립  트
위치	0   1   2   3   4   5

 

 

substing(시작위치, 종료위치)

var str = '자바스크립트';

//처음부터 세번째까지 (결과:'자바')
var substring1 = str.substring(0, 2);

//두번째부터 네번째까지 추출 (결과:'바스크')
var substring2 = str.substring(1, 4);

//세번째부터 끝까지 추출 (결과:'스크립트')
var substring3 = str.substring(2);

주의!!! 종료 위치의 -1까지 문자열을 자른다.

문자열	자  바  스  크  립  트
위치	0   1   2   3   4   5

 

 

slice(시작위치, 종료위치)

var str = '자바스크립트';

//두번째부터 네번째까지 추출 (결과:'바스크')
var slice1 = str.slice(-5, -2);

//두번째부터 네번째까지 추출 (결과:'바스크')
var slice2 = str.slice(-5, 4);

//두번째부터 네번째까지 추출 (결과:'바스크')
var slice3 = str.slice(1, -2);

//세번째부터 끝까지 추출 (결과:'스크립트')
var slice4 = str.sslice(-4);

기본적인 사용법은 substring과 같으며, 추가로 음수를 자유롭게 사용할 수 있어 뒤에서부터 자를 때 용이하다.

양수 위치	0   1   2   3   4   5
문자열	자  바  스  크  립  트
음수 위치	-6  -5  -4  -3  -2  -1