본문 바로가기
반응형

전체 글256

파일로 쪼개서 정리정돈하기 (.js) 이전 시간에 코드를 정리정돈할 수 있는 도구인 함수, 객체 등을 공부하였습니다. 이번 시간에는 서로 연관된 코드들을 파일로 그룹핑하여 묶는 정리 방법을 알아보겠습니다. 객체의 활용시간에 완성해두었던 주/야간모드 전환코드입니다. 지금까지 작업해두었던 내용을 다른 웹페이지에도 적용해야한다고 생각해봅시다. 태그 내용만 복사해서 다른 html 파일에 붙여넣으면 동일한 버튼이 생성된것처럼 보여지겠지만, 실제로 그 기능은 작동되지않습니다. 이 기능을 실행하기 위해서는 부분도 함께 복사해서 적용을 시켜줘야합니다. 하지만, 이렇게 적용해야할 페이지가 매우 많고 수시로 수정작업도 일어난다고 가정해봅시다. 파일을 관리하기가 매우 어려워질것입니다. 때문에 여기서 우리가 만들어낸 부분만 파일을 따로 생성해서 저장한 뒤 관리하.. 2021. 10. 5.
How TO-Login Form (로그인 폼 만들기) w3schools의 JavaScript How To 예제 중 로그인 폼을 만들어보겠습니다. https://www.w3schools.com/howto/howto_css_login_form.asp How To Create a Login Form How TO - Login Form Learn how to create a responsive login form with CSS. Click on the button to open the login form: Login Try it Yourself » How To Create a Login Form Step 1) Add HTML: Add an image inside a container and add inputs (with a matching labe www.w3s.. 2021. 9. 30.
객체와 반복문 / 객체 프로퍼티와 메소드 이번 시간에는 반복문을 활용하여 생성된 객체 내에 있는 모든 데이터를 가져오는 방법을 알아보겠습니다. 먼저, 객체를 만들고 불러오는 지난 예제입니다. 이 데이터를 반복문을 활용해 동일한 결과를 출력하도록 만들어 보겠습니다. - 아래 사이트를 참조하여 for..in 형식으로 작성하겠습니다. loops - How to iterate over a JavaScript object? - Stack Overflow How to iterate over a JavaScript object? I have an object in JavaScript: { abc: '...', bca: '...', zzz: '...', xxx: '...', ccc: '...', // ... } I want to use a for loop t.. 2021. 9. 28.
How To- Slideshow (이미지 슬라이드쇼 만들기) w3schools의 JavaScript How To 예제 중 슬라이더를 만들어보겠습니다. https://www.w3schools.com/howto/howto_js_slideshow.asp Example 1. Slideshow 뼈대잡기 (Feat.HTML) 슬라이더에 보여주고싶은 내용 : 페이지 표기 / 이미지 파일 / 이미지 설명글 위 내용은 캡쳐에 표시한 ~ 까지이며 슬라이드를 세개 만들어줄 것이기 때문에 를 세개 작성하였다. Example2. CSS 요소 추가 태그 내에 태그를 생성하고 태그 내에 사이트에 작성된 내용을 그대로 복사하였습니다. (Example 1에서 만들어둔 이미지 파일이 사라지고 dot 세개만 보여지지만, 당황하지않아도 됩니다.) Example3. JavaScript 추가하기 Exa.. 2021. 9. 28.
img 2021. 9. 28.
객체 쓰기와 읽기 배열은 정보(데이터)의 양이 많아졌을 때 서로 연관된 정보를 정리정돈하기 위한 도구입니다. 그리고 배열이라는 도구는 순서에 따라 정돈된다는 특징이 있습니다. https://nossodia.tistory.com/121?category=921581 배열과 반복문 집에 시간이지날수록 살림은 늘어나고 살림이 늘어날 수록 정리가 힘들어집니다. 때문에 사물들을 잘 정리할 수 있도록 옷장, 책장, 냉장고 등을 구입하기도 하고, 방이 많은 집을 선호합니다. nossodia.tistory.com 배열이라는 도구는 정보를 담는 그릇이면서 정보가 순서대로 저장된다는 특징이 있지만, 객체는 순서 없이 저장할 수 있는 정보라고 할 수 있습니다. 먼저, 객체의 문법에 대해 살펴보겠습니다. 배열은 var coworkers["데이터.. 2021. 9. 27.
반응형

티스토리툴바