본문 바로가기

Front-end/Java script8

[Form, Javascript] 이메일 직접입력, select 선택 입력 #Javascript#이메일주소직접입력 #이메일주소select선택   SCRIPTdocument.addEventListener('DOMContentLoaded', function() {var emailSelect = document.getElementById('email_1');  emailSelect.addEventListener('change', function() {var selectedOption = emailSelect.options[emailSelect.selectedIndex].value;var emailBack = document.getElementById('email_back');var emailInputText = document.getElementById('email_1_text');.. 2024. 8. 31.
[JavaScript] for, forEach를 통해 반복문 사용하기 #for #forEach #반복문 안녕하세요~ Gi-1의 개발일기입니다. for, forEach 소스 정리 하겠습니다. let x = ['a','b','c','d']; var i = 0; for(i=0; i console.log(val)); 세가지 모두 같은 값을 표시합니다. 2023. 1. 31.
[JavaScript] 중복 값이 허용되지 않는 Set 활용하기, 배열로 활용하기 #set #javascript 안녕하세요. Gi-1의 개발일기입니다. javascript의 Set에 대해서 알아보겠습니다. 1.Set? set 함수는 배열과 유사하지만 중복값을 허용하지 않는 점에서 다릅니다. 중복값이 포함되지 않아야 하는 상황에 사용하면 됩니다. 2. 기본 사용법 조금 다른점이 있다면 length를 사용하지 않고 size를 사용한다는 점입니다. set을 생성하고 콘솔을 찍어보면 다음과 같습니다. let x = new Set([1,2,3]); 혹은 let x = new Set().add("1").add("2").add("3"); 추가 add x.add("3"); 추가안됨 x.add("4"); 삭제 delete x.delete("3); 전체삭제 clear x.clear(); 포함여부 has.. 2022. 12. 3.
[javascript] 문자열에서 숫자만 추출하기 #javescript #숫자추출 안녕하세요. Gi-1의 개발일기입니다. 10000원 < 이라는 텍스트가 있으면, 그중 10000이라는 숫자만 가져오고 싶을 때가 있습니다. var PriceText = $("p").text(); var regex = /[^0-9]/g; var numPrice = rightMenuTotalPrice.replace(regex, ""); console창에 테스트한 결과 스크린샷입니다 2022. 8. 31.
체크 시 Value값 쿠키에 저장 / 다른페이지에 출력하기 #javascript #Cookie #checkbox #value 안녕하세요 Gi_1의 개발일기입니다. 최근, 재고리스트에서 재고를 선택하여 제출버튼을 누르면 다른 게시판 or 이메일전송 작성하기 화면으로 넘기는 일을 하게되었습니다. 1차적으로, PHP의 POST방식을 이용했지만 클라이언트는 체크한 value값이 페이지를 벗어났다가 돌아와도 유지되기를 바랬습니다. 그래서 Cookie를 이용해서 구현해보고자 합니다. INDEX.HTML onclick = checkItem(this)를 넣었습니다. SCRIPT function checkItem(chk) { var chkmno = getCookie("chkmno"); var arr_chkmno; var chk_value = trim(chk.value); if(.. 2022. 6. 7.
setCookie, DeleteCookie, Getcookie 세팅 function setCookie(cookieName, value, exdays){ var exdate = new Date(); exdate.setDate(exdate.getDate() + exdays); var cookieValue = escape(value) + ((exdays==null) ? "" : "; expires=" + exdate.toGMTString()); document.cookie = cookieName + "=" + cookieValue; } function deleteCookie(cookieName){ var expireDate = new Date(); expireDate.setDate(expireDate.getDate() - 1); document.cookie = cookieNa.. 2022. 6. 6.
[노마드 코더] 바닐라 JS로 크롬 앱 만들기 #Javascript #바닐라JS  안녕하세요. Gi_1입니다.노마드코더의 무료 자바스크립트 강의, 바닐라 JS로 크롬 앱 만들기 코드 정리 입니다.무료강의를 신청하면 메일로 퀴즈가 날라온다는데.. 저는 몰랐어서 안하는 바람에 재신청해서 하고 있습니다 ㅎ;;몇번 안하면 실패!!하면서 기회가 없고 다시 신청해야하니 강의를 들으실 분들은 참고 해주세요.  미리보기  오른쪽 위에는 사용자의 위치 / 날씨 / 기온이 나타납니다.이름을 입력하여 로그인 할 수 있으며 일정을 기록 할 수 있습니다.새로고침을 할 때 마다, 배경사진과 제일 하단의 명언이 교체됩니다.이는 백앤드를 필요로 하지 않고, 새로고침을 해도 유지가 됩니다. ( 쿠키 삭제 등을 하면 사라집니다. )  #어떻게 입력된 정보가 자바스크립트만으로 저장 .. 2022. 2. 1.
[자바스크립트] 클릭시 클래스 추가/제거 #javascript #toggle #click #classList #add #remove 안녕하세요 Gi_1입니다. 오늘은 제가 가장 많이 사용했던 클릭 시 클래스 제거/추가를 작성해보고자 합니다. 사실 업무를 할 때는 제이쿼리로 사용 했지만, 자바스크립트를 공부하며 다시 정리해봅니다! 첫번째는, toggle을 이용하여 하는 방법이고, 두번째는 if else를 이용하여 작성하겠습니다. HTML Grab me! CSS .hello h1{ color: blue; transition: all 0.3s ease-in-out; } .hello h1.clicked{ color: tomato; } Script --공통-- const title = document.querySelector(".hello h1"); 1.. 2022. 1. 29.