어제 오늘 내일

HTML에서 외부 JS 파일의 함수 호출하기 1. JavaScript 파일 생성먼저, 외부 JavaScript 파일을 생성합니다.예를 들어, script.js 파일을 다음과 같이 만듭니다.// script.jsfunction sayHello() { alert("Hello, World!");}  2. HTML 파일에 외부 JS 파일 연결HTML 파일에서 외부 JS 호출 예제 Say Hello    src="script.js"  외부 JavaScript 파일의 경로를 지정합니다.이 예제에서는, script.js가 HTML 파일과 같은 디렉토리에 있다고 가정합니다.경로 설정같은 폴더에 있을 경우: 다른 폴더에 있을 경우 :   defer  HTML 문서가 완전히 파싱된 후에 JavaScript가..

Javascript  삼항연산자 사용법 및 활용 예제 1. 문법condition ? expressionIfTrue : expressionIfFalse;condition: 평가할 조건 (참 또는 거짓이 될 수 있음)expressionIfTrue: 조건이 참일 때 실행될 표현식expressionIfFalse: 조건이 거짓일 때 실행될 표현식 2. 기본 예제const age = 20;const canVote = age >= 18 ? '투표 가능' : '투표 불가';console.log(canVote); // '투표 가능'age >= 18이 참이므로 '투표 가능'이 출력됩니다. 3. 중첩 삼항 연산자삼항 연산자를 중첩해서 사용할 수 있지만, 가독성이 떨어질 수 있으므로 주의해야 합니다.const score = ..

Javascript attribute(속성) 다루기추가 및 변경 (setAttribute() 또는 점 표기법 사용)읽기 (getAttribute 또는 점 표기법 사용)삭제 (removeAttribute)찾기 (hasAttribute)속성 목록 가져오기 (attributes) 1. 추가 및 변경 (setAttribute 또는 점 표기법 사용)setAttribute(name, value) : 속성을 추가하거나 기존 속성의 값을 변경합니다.점 표기법 (element.attribute = value) : 동일한 속성을 추가하거나 변경합니다.// HTML 예시// // JavaScriptconst element = document.getElementById('example');// 방법 1: setAttribut..

정규식으로 핸드폰 번호 체크하기하이픈(-) 포함하이픈(-) 및 공백 미포함 (숫자만 포함)  1. 하이픈 포함허용하는 형식010-1234-5678011-234-5678016-789-1234017-456-7890019-9876-5432 정규식/^01[016789]-\d{3,4}-\d{4}$/ ^: 문자열 시작01: 핸드폰 번호는 01로 시작[016789]: 두 번째 자리는 0, 1, 6, 7, 8, 9 중 하나010, 011, 016, 017, 018, 019만 유효-: 하이픈이 반드시 포함되어야 함\d{3,4}: 중간 번호는 3자리 또는 4자리\d{4}: 마지막 번호는 4자리$: 문자열 끝 예제 코드function isHyphenMobileNumber(phone) { const regex = /^01[..

정규식으로 전화번호 체크하기 1. 하이픈 포함 전화번호 검사형식 예시010-1234-567802-123-4567031-123-4567정규식/^0\d{1,2}-\d{3,4}-\d{4}$/ ^: 문자열 시작0: 전화번호는 0으로 시작\d{1,2}: 지역번호는 1~2자리 (02, 031 등)-: 하이픈이 반드시 포함되어야 함\d{3,4}: 중간 번호는 3~4자리\d{4}: 마지막 번호는 4자리$: 문자열 끝예제 코드function isHyphenPhoneNumber(phone) { const regex = /^0\d{1,2}-\d{3,4}-\d{4}$/; return regex.test(phone);}console.log(isHyphenPhoneNumber("010-1234-5678")); // truec..

정규식으로 문자열이 숫자인지 체크하기JavaScript에서 문자열이 숫자만으로 이루어졌는지 확인하기 위해 다양한 정규표현식을 사용할 수 있습니다.방법 1: 기본 정규표현식가장 기본적인 형태로, 문자열이 0에서 9까지의 숫자로만 이루어졌는지 검사합니다.function isNumeric(str) { return /^[0-9]+$/.test(str);}console.log(isNumeric("12345")); // trueconsole.log(isNumeric("123a5")); // falseconsole.log(isNumeric("00123")); // trueconsole.log(isNumeric("")); // false (빈 문자열도 false 처리)console.log(isNume..

switch 조건문 사용법 및 활용 예제JavaScript에서 switch문은 주어진 표현식의 값에 따라 여러 경우(case) 중 하나를 선택하여 실행할 때 사용합니다.if-else 문보다 가독성이 좋고, 여러 조건을 처리할 때 유용합니다.  기본 문법switch (표현식) { case 값1: // 값1일 때 실행할 코드 break; case 값2: // 값2일 때 실행할 코드 break; default: // 모든 case가 해당하지 않을 때 실행할 코드} 표현식의 결과와 case에 나열된 값들을 일치시켜 해당 블록을 실행합니다.break는 해당 블록을 실행한 후 switch문을 빠져나가도록 합니다.default는 모든 case가 일치하지 않을 때 실행됩니다. (else..

Javascript에서 정규식을 이용하여 문자열의 공백을 제거하는 방법입니다. str.replace(/\s/g, ''); 예제 const str = "안 녕 하 세 요 "; const trimStr = str.replace(/\s/g, ''); console.log(trimStr); // "안녕하세요"; 1. replace() 함수 JavaScript의 replace() 함수는 문자열에서 특정 패턴을 찾아 다른 문자열로 대체하는 데 사용됩니다. str.replace(searchValue, newValue) 자세한 설명은 지난 포스팅을 참조하세요. [Javascript] 문자열에서 특정 문자열 치환하기 (replace) [Javascript] 문자열에서 특정 문자열 치환하기 (replace) Javascr..

값 가져오기, 넣기, 지우기 다음은 textarea의 값을 읽고, 쓰고, 지우는 예제입니다. 안녕하세요 값 가져오기 값 설정하기 값 삭제하기 // textarea의 값을 가져와서 출력 function getTextareaValue() { // textarea 값 읽어오기 const textareaValue = document.getElementById('myTextarea').value; // 읽어온 내용 출력 document.getElementById('result').innerText = textareaValue; } // textarea에 새로운 값을 설정 function setTextareaValue() { const newValue = '새로운 텍스트 내용'; document.getElement..

동적 HTML 요소 추가하기 다음은 버튼이 클릭되면 container div에 동적으로 div text 요소가 추가되는 예제입니다. 텍스트 추가 function addText() { // 추가할 요소 생성 const newElement = document.createElement('div'); // 요소 안에 html 요소 추가 newElement.innerHTML = '텍스트가 추가되었습니다.'; // 생성된 요소를 추가할 부모요소(container div) 선택 const container = document.getElementById('container'); // 생성된 요소를 기존의 container div에 자식 요소로 추가 container.appendChild(newElement); } 위 ..