목록분류 전체보기 (135)

열정 실천

[JavaScript] DOM이 뭔가요? ----- getElementById(), getElementByClassName(), getElementByTagName(), querySelector(), querySelectorAll()

DOM : Document Object Model 브라우저에서 자바스크립트가 html 요소를 제어할 수 있도록 제공하는 API이다. (API에 관한 설명은 아래에_) JavaScript는 html 요소를 추가하거나 변경과 같은 조작을 위해 만들어진 언어이다. 이러한 html파일을 javascript로 어떻게 제어할 수 있을까? 모든 브라우저에는 웹문서를 해석(parding)하는 웹 렌더링 엔진이 있다. 이 렌더링 엔진은 html 코드를 해석하여 모든 요소를 객체화하여 자바스크립트가 접근할 수 있게끔한다. 이렇게 문서를 객체화하였다하여 Document Object Model(문서 객체 모델)이라고 부른다. 이 DOM은 트리 형태로 되어있고 각각의 요소를 노드라고 부른다. 우리는 원하는 노드에 접근하여 변경..
개발 공부/JS 2023. 5. 11. 15:00
[JavaScript] JS 완전 기초 문법 한 방에 끝내기!!

📢 변수 선언 상수 const a = 1; 변수 let b = 2; 📢 데이터 타입 자바에서는 숫자면 int, double, long 다 타입을 지정해줘야하는데 여기서 변수는 다 let으로 지정 1. 숫자 2. string 3. boolean 4. null 5. undefined null은 개발자가 없다고 고의적으로 설정하는 값, undefined는 개발자가 설정하지 않았기 때문에 없는 값 var num = 10; var st = "Hello"; var bool = true; var n = null; var unde; 📢 배열 const arr = [1,2,3,"hi",false, null]; console.log(arr); console.log(arr[3]) //4번째 요소만 출력 arr.push("n..
개발 공부/JS 2023. 5. 9. 14:45
호스팅 vs 도메인 차이

호스팅과 도메인은 각각 다른 개념이다. 호스팅은 인터넷에 웹 사이트를 올리기 위한 공간과 서비스를 제공하는 것이다. 웹 사이트를 만들고 호스팅 업체에 업로드하면, 인터넷 사용자들은 해당 웹 사이트에 접속할 수 있다. 반면에, 도메인은 인터넷에 접속하기 위한 주소로, 웹 사이트를 찾아가는 데 사용된다. 도메인은 IP 주소를 사람이 이해하기 쉬운 형태로 변환해주는 역할을 한다. 예를 들어, www.example.com과 같은 도메인 이름은 실제로 해당 웹 사이트가 위치한 IP 주소와 매핑되어 있으며, 사용자는 이를 이용해 해당 웹 사이트에 접속할 수 있다. 따라서, 호스팅과 도메인은 서로 다른 개념이지만, 인터넷에서 웹 사이트를 운영하기 위해서는 둘 다 필요하다. 호스팅은 웹 사이트를 구축하고 운영하기 위한..
CS/공부노트 2023. 4. 18. 17:10
[CSS 010] FLEXBOX 안에서 각각 좌우 정렬하기

앞서 배운 FLEX 속성 중에 한 개의 아이템에만 세로 정렬을 따로 주고 싶을 때 align-self 속성을 이용했다. 하지만 다음과 같이 좌우 정렬을 각각의 아이템에 적용하는 속성은 무엇일까?! 👀 정답은?? 👀 속성이 아닌 margin을 이용한다!! 여기서 5번 박스를 오른쪽 끝에 붙이고 싶다면? 5번 박스에 margin값을 auto로 지정하면된다!!😎 (쉽쥬?)
카테고리 없음 2023. 4. 6. 20:01
[CSS 009] FLEX 사용법 (여러가지 속성과 속성 값 모음)

가로 배치를 손쉽게 하기 위한 방법으로 Flex (Flexible Box, Flexbox)가 있다. float나 inline-block 을 이용했던 기존 방식보다 훨씬 편리하게 레이아웃을 배치할 수 있다. display: flex; 를 부모 요소에 선언하면 그 안에 있던 자식 요소들은 모두 flex 컨테이너의 item이 된다. 이 flex 아이템들은 가로 방향으로 배치되고, 자신이 가진 내용물의 width만큼만 차지하게 된다. 마치 inline 요소로 바뀌는 것과 같다 height는 컨테이너의 높이만큼 늘어난다. Flex container는 여러가지 속성이 있다. justify-content , align-items, flex-direction , flex-wrap , align-content, flex..
개발 공부/CSS 2023. 4. 6. 19:41
[HTML 005] VSCode HTML 단축키 모음 💥

html 기본틀 ! + enter/ tap 코드 정렬 alt + shift + f 한줄 주석 ctrl + / 여러 줄 주석 alt + shift + a 다중 선택 alt 누른 상태로 선택 해당 커서가 있는 행 삭제 ctrl + shift + k 해당 커서가 있는 행 복사 & 붙여넣기 alt + shift + 방향키 일치하는 텍스트 찾기 ctrl + f 왼쪽 탐색기 창 on/off ctrl + b 해당 커서 행 전체 이동 alf + 위/아래 방향키
개발 공부/HTML 2023. 3. 27. 23:29
이전 Prev 1 ··· 9 10 11 12 13 14 15 ··· 23 Next 다음