<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel = "stylesheet" href = "../css/mystyle.css" type="text/css">
<script>
str = "korea 우리 나라 좋은 나라 대한 민국 Korea";
function proc1(){
a = str.charAt(6);
codea = str.charCodeAt(6);//문자코드
res = str + "<br>";
res += "str.charAt(6) : " + a + "<br>";
res += "str.charCodeAt(6) : " + codea;
document.getElementById('result1').innerHTML = res;
}
function proc2(){
subs = str.substring(3, 7); //: 3~7사이(7빼고)
slic = str.slice(3, 7); //3~7사이(7빼고)
sublen = str.substr(3, 5); //: 3부터 5개 글자 추출(마지막 빼고)
res = str + "<br>";
res += "str.substring(3, 7) : " + subs + "<br>";
res += "str.slice(3, 7) : " + slic + "<br>";
res += "str.substr(3, 7) : " + sublen + "<br>";
document.getElementById('result2').innerHTML = res;
}
function proc3(){
arr = str.split(" ");
document.getElementById('result3').innerHTML = arr;
}
function proc4(){
area = document.getElementsByTagName('textarea')[0].value
//area = document.querySelector('textarea').value;
reparea = area.replace(/\r/g, "").replace(/\n/g, "<br>");
/* aa = str.replace(/korea/gi,'코리아');
alert(str + " " +aa);
*/
document.getElementById('result4').innerHTML = reparea;
}
function proc5(){
//input = prompt("찾는 문자열을 입력하세요");
value1 = str.match(/korea/gi);
console.log(value1);
value2 = str.match(/Good/gi);
console.log(value2);
str = "str.match(/korea/gi) <br>";
str += "배열을 리턴: " + value1 + "<br>";
//gi는 대소문자 둘다 출력
str += "str.match(/Good/gi)<br>";
str += "값이 없을 때 : " + value2;
document.getElementById('result5').innerHTML = str;
}
</script>
</head>
<body>
<div class = "box">
charAt(index) : 지정된 index 위치의 문자를 리턴한다<br>
charCodeAt(index) : 지정된 index 위치의 문자 코드를 리턴한다<br>
<br>
<button type = "button" onclick="proc1()">확인</button>
<div id = "result1"></div>
</div>
<div class = "box">
문자열 추출<br>
substring(start, end):start~end사이의 문자열 추출(end는 포함 안됨)<br>
slice(start, end) : start~end사이의 문자열 추출<br>
substr(start, length) : start부터 length 갯수만큼 추출<br>
<br>
<button type = "button" onclick="proc2()">확인</button>
<div id = "result2"></div>
</div>
<div class = "box">
문자열 분리<br>
split(구분자, 갯수): 구분자를 기준으로 문자열을 분리하여 배열로 생성되어 저장한다<br>
갯수는 생략가능, 생략시 전체를 대상으로 한다<br>
<br>
<br>
<button type = "button" onclick="proc3()">확인</button>
<div id = "result3"></div>
</div>
<div class = "box">
문자열 대체 - 수정<br>
replace(old value, new value): old value를 new value로 변경한다<br>
textarea에 여러줄로 입력된 문자를 script로 보낸다 - value<br>
id = result4인 요소에 출력한다<br>
입력시\r\n을 <br>태그로 변경하여 출력한다<br>
<br>
<textarea rows="5" cols="50"></textarea><br>
<button type = "button" onclick="proc4()">확인</button>
<div id = "result4"></div>
</div>
<div class = "box">
문자열 검색 <br>
match(value): value를 검색한다 <br>
검색된 문자열을 배열로 리턴하고 검색 문자가 없으면 null을 리턴한다<br>
<br>
입력시\r\n을 <br>태그로 변경하여 출력한다<br>
<br>
<button type = "button" onclick="proc5()">확인</button>
<div id = "result5"></div>
</div>
</body>
</html>
신입 개발자 입니다!!!