tree0505 님의 블로그

이벤트3_개념_익명함수사용법_01_이벤트_익명함수방법.html말 그대로 이름이 없다. funtion 이름 없음 ( ) { } 원래라면 2개인데. 편의성을 위해 합친것 ✅ 익명 함수 vs 이름 있는 함수 (비교)항목이름 있는 함수익명 함수작성 예function sayHi() { alert("Hi"); }function() { alert("Hi"); }사용 예addEventListener("click", sayHi)addEventListener("click", function() {...})재사용 가능?✔ (여러 곳에서 호출 가능)❌ (한 번 쓰고 끝)주로 언제 사용?복잡하거나 여러 곳에서 쓰는 함수짧고 한 번만 쓸 때🔥 중요 차이점 요약항목설명addEventListener(...)이벤트를 등록하는 방식 ..

이벤트2_개념_addEventListener이벤트addListener방법온클릭이과 햇갈리면 안된데. 소괄호가 없다.id="btn": 이 버튼을 자바스크립트에서 찾기 위한 이름표예요.→ id는 고유해야 하고, CSS나 JS에서 특정 요소를 정확하게 식별할 때 사용합니다. .querySelector(...): HTML 요소를 CSS 선택자 방식으로 찾는 함수 문제 전체 흐름 다시 쉽게 정리!버튼이 웹페이지에 보임자바스크립트가 id="btn"인 버튼을 찾아서 변수에 저장그 버튼에 "클릭 이벤트"를 연결함클릭하면 clickMe2 함수가 실행됨함수 안의 alert가 동작해서 팝업창이 뜸_02_이벤트두개추가.html일반버튼은 누른때 반응을 안하고. 땔때 반응을 한다. 누를때 반응하고 싶으면. 이것을 만들어야 한다...

D03_dom_이벤트 이벤트1_개념_ononclick은 누르면 "clickMe( ) " 이게 동작해라 누르면 alert창을 띄운것 회원가입 했을 때 메세지를 띄울 수 있다. 아이디 입력. 10글자까지 입력 가능 버튼을 누르면 6글자 이상 예외처리 하는것 셀렉트 가져오기 onblur : 포커스를 잃으면 소문자를 대문자로 바꾸어주는것 onchange : 포커스를 잃으면 대문자 바꿔주기 셀렉트에서 온체인지 onkeydown : 키보드 누르면 이벤트가 발생 onload. : 페이지가 들어오자마자 바로 실행하는것 oninput : 누를때 마다. 바. 음량 마우스가 들어갈때. 마우스를 누를때. ul ux 사용자한테 특별히 설명이 없이도. 상황적으로 뭘 해야하는지 전달하는것 사용자에게 특별히 지시하는 설명이 없..

문법2_개념_문자열자바스크립트는 많은 기능을 제공한다.파이선 언어가 쉽다거짓말이다.숙련자에게 좋은 언어다. 좋은 기능을 많이 제공하니까 쉽다. 숙련자가오히려 c언어가 가장 쉽다. 정직함 안되면 안됨. 명확함 지금부터는 === 을 쓰는게 좋다. 문자열(String), 그리고 == vs ===의 차이를 이해str1은 문자열 값이 아니라 객체입니다.typeof str1은 "object"입니다.let str2 = "hello"; str2는 문자열 리터럴, 즉 일반적인 문자열입니다. ⭐️ typeof str2는 "string"입니다. document.write(str1 == str2, ""); ==는 **느슨한 비교(loose equality)**로, 타입이 다르면 자동 형변환 후 비교합니다. str1은 객체지만..

자바스크립트 공부할 때 주의점 뭔가 계속 생겨 항상 검색을 필수로 해야 한다. 항상 정리를 잘 해야 한다. 문법1_개념_배열for...in은 객체의 속성을 하나하나 순회할 때 더 많이 사용돼요.for...in은 객체의 모든 속성을 하나씩 꺼내서 작업할 때 사용합니다.구문사용 대상특징for...in객체(object)속성(key)을 하나씩 순회for...of배열(array)값(value)을 하나씩 순회forEach()배열(array)콜백 함수로 값을 순회배열 선언하는 방법이 여러개이다. JavaScript가 유연한 언어라서, 개발자가 다양한 방식으로 같은 결과를 만들 수 있게 허용하기 때문이에요.1. 리터럴 방식 let arr1 = [1, "a", true];가장 간결하고 직관적입니다.✅ 실무에서 가장 많이..

태그7_개념_속성변경태그8_개념_자식속성

태그6_개념_값변경의종류안에 찾는 명령어가 4개 있다. (1) innerText : 사용자에게 보여지는 텍스트만 가져옴 (2) innerHTML : html 전체를 다 가져옴 (3) textContent : 숨겨진 텍스트까지 포함해서 텍스트만 모두 다 가져옴 (4) value : , 태그의 값을 가져옴프론트엔드디자이너들이 만든 수많은 태그들중 원하는 것을 규칙 찾아서.이것을 바꾸는것 문제

태그3_개념_tag 클래스를 지정을 안했는데. 왜 콜랙션이 들어갔지? f12왜 배열로 잡히지? 태그4_개념_namenull처리가 안된다. 태그5_개념_queryselector태그를 찾는게 중요하다. id. class.tag 를 찾을 수 있고.name은 nodeList에 저장이 되어 있어서 찾을 수 없다. null이 잡힌다. quertSelector 로 선택시에는 배열로 잡히지 않는다. 태그3_문제_tag

그럼 내가 백엔드로 script안에 내용들을 적었거든 근데 프론트엔드로서 script를 적는 것은 body에 있는 것들을 제어하기 위해 script에 적는거야? 자바스크립트로 백엔드로 해서 script에 적는건 뭐니? 자바스크립트로 백엔드와 프론트엔드는 무슨 차이가 있는거야? ChatGPT의 말:좋은 질문이에요! 자바스크립트를 백엔드와 프론트엔드에서 어떻게 사용하는지, 그 차이가 무엇인지에 대해 정확히 이해하는 것이 중요해요. 😊이제 프론트엔드와 백엔드에서 자바스크립트를 어떻게 사용하는지, 차이점을 설명해드릴게요.1️⃣ 프론트엔드에서 자바스크립트 사용📌 기본 개념:프론트엔드는 사용자가 보는 화면과 상호작용하는 부분을 담당합니다.자바스크립트를 HTML 문서 내에 삽입해서 웹페이지에서 동적 콘텐츠를 생성..

태그2_개념_class태그에 이름 짓는거에 2가지 방법이 있다. 1 - id로 변수명을 지을 수 있다.2 - class로도 지을 수 있다. 출력이 이상하게 된다. 태그가 출력이 되는게 아니라. class는 배열에 담긴다. HTML.Collection(1) 이렇게 출력이 된다. 없는것을 선택하면. 빈배열이기 때문에. HTML.Collection(0) => 0 빈배열로 잡힌다. 사이즈가 0이다. id는 변수에 저장이 된다. 1개만 잡힘 출력할때 [ ] 대괄호를 넣어야 한다. console.log($a[0].innerHTML); 한개짜리는 id로 잡고여러개는 class로 한다. 반복문을 쓸 수도 있다. 반복문을 쓸 수 있다.body에 적은 것은 웹페이지에서 출력이 된것이고. 반복문은 콘솔에서 반복되게 출력하..