천천히 알아가는 세상

안녕하세요. 자바스크립트에서 Enter 이벤트 작성하는 방법입니다. login_pw 아이디를 가진 곳에서 Enter를 클릭하면 이벤트가 발생합니다. keyCode를 이제는 안 쓰는 것으로 알고는 있지만, 아직 사용하는 곳도 있기 때문에 2개다 작성하였습니다. document.getElementById('login_pw').addEventListener('keydown', (e) => { if (e.key == "Enter" || e.keyCode == "13") { // 실행할 코드 user_login(); } }); 감사합니다.

안녕하세요. 이번에는 includes 함수에 대해서 알아보겠습니다. includes 함수는 단어 또는 문장에서 본인이 찾고자 하는 단어가 포함되어 있는지를 확인할 수 있습니다. 사용 방식은 아래와 같습니다. text.includes('찾는 단어'); 찾는 단어가 있으면 True, 없으면 False를 반환합니다. 아래 코드는 다른 코드에서 사용하던 코드인데 예시용으로 가져왔습니다. if 문 앞이 엄청 길어 보이지만, 전부 확인할 필요는 없습니다. textContent로 가져온 글자에 '상승'이 포함되어 있으면, #ED3023 색으로 변경 '하강'이 포함되어 있으면, #0096FF 색으로 변경 'NEW"이 포함되어 있으면, #00CD3C 색으로 변경 아무것도 없으면 grey 색으로 변경 한다는 내용입니다. ..

안녕하세요. JavaScript로 Head 태그에 동적으로 추가하는 방법입니다. sciprt 파일과, css 파일을 추가하는 방법으로 사용하게 되면 head 태그의 맨 마지막에 추가되는 것을 볼 수 있습니다. 1. script head 동적 추가 const script = document.createElement('script'); script.src = '/static/js/test2.js'; script.type = 'text/javascript' document.head.appendChild(script); 2. css head 동적 추가 const css1 = document.createElement('link'); css1.src = '/static/css/youtbeRealChart.css';..

안녕하세요. 이번에는 정규 표현식에 대하여 알아보겠습니다. 1. 유효성 검사 (form validation) form 요소들에 정보가 올바르게 입력되었는지 검사하는 것 ex. 비밀번호: 8자리 이상, 특수문자 및 대문자 1개 이상 포함 ex. 이메일: @ 기호 반드시 포함 required : 필수 값 minlength / maxlength : 최소/최대 문자수 min / max : 최소/최대 값 type : 입력받는 정보 타입 pattern : 정규식으로 검사 2-1. 정규표식 정규 표현식 - JavaScript | MDN 정규 표현식 - JavaScript | MDN 정규 표현식, 또는 정규식은 문자열에서 특정 문자 조합을 찾기 위한 패턴입니다. JavaScript에서는 정규 표현식도 객체로서, Reg..

안녕하세요. 이번에는 Promise(프로미스)에 대하여 알아보겠습니다. 1. 프로미스(Promise) Callback Hell 로 인한 복잡도 증가와 예외처리의 어려움을 해결하기 위해 만들어진 것 비동기 작업에서 성공과 실패를 분리해 메소드를 수행한다. resolve(value) : 일이 성공적으로 끝난 경우 프로미스를 실행한 곳의 then으로 들어간다. reject(error) : 에러 발생 시 프로미스를 실행한 곳의 catch로 들어간다. 2. 프로미스 상태 Pending Promse를 수행 중인 상태 Fulfilled Promise가 resolve 된 상태 Rejected Promise가 지켜지지 못한 상태 Settled fulfilled 혹은 rejected로 결론이 난 상태 코드 작성 방법 ne..