학습단/HTML+CSS+Javascript 학습단18 길벗 HTML 자율 학습단 마무리 후기 이번 코딩 자율학습단 2기에 참여했고, 그 경험에 대한 후기를 남기려고 합니다. 이 책은 초보자가 웹사이트를 만들기 위한 기초를 다지는데 도움이 되는 좋은 책인것 같습니다. 책에 있는 설명과 코드 그리고 그림만 봐도 이해는 되지만 실습 위주로 구성되어 있어, 실제로 코드를 작성해보며 따라하는 것과 기초적인 html, css, javascript 문법부터 설명하기 때문에 초보자분들도 충분히 따라할수 있을것 같았습니다. 추가로 중요한 내용들과 실무에서 주로 사용하는 내용들이 따로 나와 있어 쉽게 공부 할수 있었던것 같습니다. 전반적으로 위 책을 통해 자율학습단에 참여하여 공부한것은 좋은 경험이었습니다. 날마다 매니저분이 그날 학습일정에 대해 설명해줘 완독하는데 쉽게 했던것 같았고 책의 내용을 실제로 따라하며.. 2023. 4. 1. 12-3장 문서 객체 모델과 이벤트 다루기 공부할 내용 (487~522쪽) 1. form 조작하기 - form 태그 선택하기 HTML 폼 요소의 시작은 항상 form 태그이다. -form 속성 사용하기 document 객체의 forms 속성은 모든 form 태그의 노드 정보를 HTMLCollection 객체에 담아 반환한다. -name 속성 사용하기 form 태그에 name 속성을 사용하면 form 속성보다 직관적으로 form 요소 노드를 선택할수 있다. -폼 요소 생각하기 폼요소에는 선택할때는 elements 속성이나 name 속성을 사용한다. -폼 요소 입력값 다루기 폼 요소는 사용자에게 값을 입력받아 이를 서버에 전달한다. 전달받은 값을 서버에 전달하기까지 폼 요소에 입력된 값이 유효한지 검증할수 있어야 한다. 2. 이벤트 다루기 이벤트는 .. 2023. 3. 29. 12-2장 문서 객체 모델과 이벤트 다루기 공부할 내용 (456~486쪽) 1. 문서 객체 모델이해하기 웹 브라우저는 HTML 문서의 구성 요소를 모두 객체로 인식한다. - 문서 객체 모델이 생성되는 방식 문서 객체 모델은 웹 브라우저가 HTML 문서를 해석하고 해석한 HTML 문서 구조를 객체로 변환하는 방식으로 생성된다. 2. 노드 선택하기 자바스크립트로 웹 브라우저에 표시되는 HTML 문서를 조작하려면 문서 객체 모델을 조작해야 한다. 문서 객체 모델은 WINDOW 객체의 DOCUMENT 객체를 사용해 조작할 수 있다. - 속성으로 노드 선택 (예시들) parentNode - 부모노드를 반환한다. childNodes - 모든 자식 노드를 반환한다. parentElement - 부모 요소 노드를 반환한다. childeren - 자식 요소 노드.. 2023. 3. 28. 12장 문서 객체 모델과 이벤트 다루기 공부할 내용 (433~453쪽) 1. 표준 내장 객체 자바스크립트에 기본으로 내장된 객체를 말한다. -문자열을 다루는 String 객체 문자열에서 사용할 수있는 속성과 메서드가 정의되어 있다. includes() - 메서드 매겨변수애 안저로 전달되는 문자열이 대상 문자열에 포함되면 true 아니면 false replace() - 대상 문자열에서 메서드의 매개변수에 인자로 전달되는 문자열과 일치하는 한부분을 찾아 다른 데이터로 변경한 새로운 문자열로 반환 replaceAll() - 대상 문자열에서 메서드의 매개변수에 인자로 전달되는 문자열과 일치하는 모든부분을 찾아 다른 데이터로 변경한 새로운 문자열로 반환 split() - 매서드의 매개변수에 인자로 전달되는 구분자를 이용해 대상 문자열을 여러 개 의 문.. 2023. 3. 27. 11장 자바스크립트 객체 다루기 공부할 내용 (420~432쪽) 1.객체란? -객체란 키와 값으로 구성 속성의 집합이다. -객체는 모든 자료형의 데이터를 값으로 가진다. -배열 , 숫자, 논리 데이터를 다음과 같이 한 객체의 속성으로 추가할수 있다. const item = { name: "sword", price: 300$, } 2. 객체 속성 다루기 - 대괄호 연산자로 접근하기 item["price"] - 마침표 연산자로 접근하기 item.price - 객체 속성값 변경하기 - 객체 속성 동적으로 추가하기 이미 만들어진 객체에 나중에 속성을 추가하는 것이다. - 객체 속성 동적으로 삭제하기 객체 속성에 접근할 때 앞에 delete 키워드를 명시하면 속성이 삭제된다. 2023. 3. 24. 10-2장 자바스크립트 함수 다루기 공부할 내용 (406~417쪽) 1.스코프 스코프는 변수나 함수와 같은 참조 대상 식별자를 찾아내기 위한 규칙이다. -함수 스코프 함수 스코프는 함수에저 정의한 블록문만 스코프의 유효범위로 인정하는 방식이다. let a = 10; // 전역 스코프 function sum(){ let b = 10; // 지역 스코프 console.log(`함수 내부: ${b}`); } sum(); console.log(`함수 외부: ${a}`); -블록 스코프 {}로 구성된 블록문 기준으로 스코프의 유효범위를 나누는 방식이다. var a = 10; { var b = 20; console.log(`내부 a: ${a}`); console.log(`내부 b: ${b}`); } console.log(`외부 a: ${a}`); c.. 2023. 3. 22. 이전 1 2 3 다음
