본문 바로가기

웹코딩 배우기293

문자 method #2 - 자바스크립트 See the Pen 문자열 메서드 by nilgi (@nilgi) on CodePen. let t1 = "닐기"; let t2 = "티스토리 블로그"; let t3 = t1.concat(" ",t2); // 문자 합치기 document.getElementById('cc1').innerHTML = t3; let t3 = t1.concat(" ",t2); let t3 = "닐기" + " " + "티스토리 블로그"; // concat()은 '+' 연산과 같다. let tr1 = " 닐기 "; document.getElementById('tr1').innerHTML = tr1; // 공백을 없애고 표시한다. let ps1 = "1"; document.getElementById('ps1').innerHTML =.. 2021. 11. 23.
문자 바꾸기 - 자바스크립트 See the Pen 문자 대체 by nilgi (@nilgi) on CodePen. replace()는 문자를 바꿈 인생은 찰나다. 삶의 선택 text.replace("닐기", "우주"); // 첫번째 문자부터 바꾼다. text.replace("ab", "A+B"); // 대소문자를 구별한다. text.replace(/ab/i, "A+B"); // 대소문자를 구별하지 않으려면 /문자/i text.replace(/AB/g, "ab"); // 모든 글자를 바꾸려면 /문자/g text.toUpperCase(); // 소문자를 대문자로 text.toLowerCase(); // 대문자를 소문자로 어렵다... 그만할까? ㅠ-ㅠ 2021. 11. 22.
문자 method #1 - 자바스크립트 See the Pen string method by nilgi (@nilgi) on CodePen. • 문자의 길이(수) : length let ng = "본디 인간은 외롭고 태어나 어느 누군가의 사랑을 받고 자란다. 인간은 기억을 잊게 또는 잊을 수 있게 태어났다. 그리하여 죽는 날까지 외롭다고 착각한다." document.getElementById('tl1').innerHTML = ng.length; • 문자 선택 3가지 방법 - slice(시작n, 끝n+1) : n은 음수 허용 - substring(시작n, 끝n+1) : 음수 없음 - substr(시작n, 글자수) : 음수 허용 - 자바스크립트 첫 번째는 0이다. 끝n의 숫자는 +1이라 생각한다. - slice(시작n, 끝n+1) let ng = .. 2021. 11. 19.
문자(strings) - 자바스크립트 See the Pen 문자열 by nilgi (@nilgi) on CodePen. ▶ 문자열(strings) - 텍스트를 저장하고 설정 • 문자는 " ", ' '안에 쓰고 0개 이상 글자 let text = "nilgi"; let text = 'nilgi'; • 문자 안에 ", '를 표시하려면 ' ', " " 쓴다. let text = "nilgi 'tistory blog'"; let text = 'nilgi "tistory blog"'; • 글자수 length let text = "akdjklajflkjf98019238174jaslkdjalsdj"; document.getElementById('tl').innerHTML = text.length; • \ 쓰는 방법 let ng1 = "큰따옴표 문자열 안.. 2021. 11. 19.
Event - 자바스크립트 See the Pen event by nilgi (@nilgi) on CodePen. Event는 HTML 페이지 반응을 위해 사용합니다. HTML 웹 페이지 로드될 때, HTML 입력 필드가 변경됐을 때, HTML 버튼을 클릭했을 때 등등 코드를 실행합니다. 쓰는 방법은 나 처럼 '. "를 사용합니다. 눌러 ◀ id를 사용하여 html 요소를 변경 눌러보시게~ ◀ this로 자체 요소를 변경 눌러줘ㅠ-ㅠ • event 종류 onchange : HTML 요소 변경 onclick : HTML 요소 클릭 onmouseover : HTML 요소 위에 마우스를 올렸을 때 onmouseout : 마우스가 HTML 요소에서 나올 때 onkeydown : 키를 누를 때 onload : 페이지가 로딩될 때 2021. 11. 18.
개체(Object) - 자바스크립트 See the Pen 자바스크립트 개체 by nilgi (@nilgi) on CodePen. • 자바스크립트 개체(object) let menu = "lucy" // menu 변수에 lucy라는 값을 할당 const ng = {name:"nilgi", Btype:"AB", blog:"tistory"}; // 개체도 변수이며 많은 값을 가진다. const ng = { name:"nilgi", Btype:"AB", blog:"tistory" }; // 보기 편하게 줄 바꿈을 사용해도 된다. • 개체 속성 엑세스 objectname.propertyname objectname["propertyname"] // 개체 속성은 이렇게 쓴다. 개체 속성은 css와 비슷하다. class를 css에서 .classname으.. 2021. 11. 17.
function - 자바스크립트 See the Pen by nilgi (@nilgi) on CodePen. • 자바스크립트 function : 특정 작업 때 사용. ▲ function name(parameter1, parameter2, parameter3) { } // parameter : 문자, 숫자, 밑줄, $ • function 호출 : 클릭 이벤트 구현, 자바스크립트 호출, 자동 자체 호출. ▲ function return - 스크립트 다음에 코드를 실행하기 위해 return을 사용. return은 연산하며 호출자에게 다시 값을 지정. ▲ function 재사용 가능하여 여러 가지 결과를 만든다. ▲ 변수는 function 영역에서만 엑세스된다. 2021. 11. 16.
자바스크립트 데이터 유형 See the Pen 자바스크립트 데이터 유형 by nilgi (@nilgi) on CodePen. let a = 3; // 숫자 let b = "Tstiory Blog"; // 문자는 ", '로 쓴다. let c = {name:"nilgi", BloodType:"AB"}; // 개체는 {}로 쓴다. let a = 3 + "nilgi"; // 숫자 + 문자 let a = "nilgi" + 3; // 문자 + 문자 : 문자 뒤에 오는 숫자는 문자 처리한다. let a = 1 + 5 + "nilgi"; >> 6nilgi let a = "nilgi" + 5 + 1; >> nilgi51 let c = 22; c = 12; c = jj // 적용 숫자 소수점 표현 let g = 39.00; >> 39 // 소수점.. 2021. 11. 15.
자바스크립트 =(할당) 쓰는 방법 See the Pen 자바스크립트 할당 응용 by nilgi (@nilgi) on CodePen. 2021. 11. 14.