새벽코딩

이번 포스팅에서는 form 의 input tag 안에서 1. input에 입력된 값을 get하는 방법 2. 그 값이 공백인 경우에 alert을 띄워주는 방법 3. 또한 값이 특정 길이 보다 짧을 경우에 alert을 띄워주는 방법을 알아 볼 예정이다. 아래와 같이 로그인을 위한 을 생성 한 후 로그인하세요 전송 닫기 미리보기 1. input에 입력된 값을 어떻게 get할까? 먼저, 위에 첫번째 input field는 email을 입력하는 부분이고, 해당 field에(id="email" 인 tag) 입력된 값이 무엇인지 아래와 같이 확인 할 수 있다. document.getElementById('email').value // id='email'인 요소의 value를 나타낸다 2. 입력값 (email 또는 p..

- jQuery 설치 구글에 jQuery cdn 검색 https://releases.jquery.com/ jQuery CDN The integrity and crossorigin attributes are used for Subresource Integrity (SRI) checking. This allows browsers to ensure that resources hosted on third-party servers have not been tampered with. Use of SRI is recommended as a best-practice, whenever libr releases.jquery.com jQuery 3.x 버전 아니면, 최신버전 jQuery 사용하려면 아래 코드를 body안에 ..

이전 포스팅에서 bootstrap을 이용하여, Navbar구현하는 법에 대해서 알아보았다. https://midnightcoding.tistory.com/100 [JavaScript기초] 5. 부트스트랩 사용하는법(bootstrap) 부트스트랩은, 기존에 만들어 놓은 Navbar, tabs, Modal등을 가져와서 구현을 할 수 있는 플랫폼이다. 사용법 1. 구글에 bootstrap을 검색하여, 아래 링크로 들어간다. 2. Bootstrap 웹페이지로 들어가서 상 midnightcoding.tistory.com 이번 포스팅에서는 Bootstrap을 이용하여, Navbar 버튼을 눌러서 서브메뉴를 보여줄수 있도록 해보자 여기에서는 div tag에 class를 탈부착하여, 요소가 보이게 또는 안보이게 만들예..

부트스트랩은, 기존에 만들어 놓은 Navbar, tabs, Modal등을 가져와서 구현을 할 수 있는 플랫폼이다. 사용법 1. 구글에 bootstrap을 검색하여, 아래 링크로 들어간다. 2. Bootstrap 웹페이지로 들어가서 상단 네브바에서 Docs로 들어간다 (상단 오른쪽 버전확인 v5.x ) 3. 위와 같이 Get started with Bootstrap 이라는 화면이 보이게 되는데, Quick start 순서대로 하면된다. 먼저 index.html을 만들고 아래 코드를 넣어준다 (vs code에서 느낌표+tab을 누르면 자동생성) Hello, world! 4. 그리고 Hello, world! 이제, 추가하고 싶은 요소를 찾아서 코드를 붙여 넣어주면 구현 가능하다. * Navbar를 추가하고 싶..

셀렉터(selector) 란? 앞에서 셀렉터(selector)에 대해서 언급을 하지 않았지만, 이미 사용하고 있다. 셀렉터는 HTML Tag를 스타일링해주기 위해 특정 tag를 선택하기 위해 사용한다. 셀렉터의 종류 - id를 선택할 때 : getElementById('id 이름') - class를 선택할 때 : getElementsByClassName('class 이름') 사용예시 alert1 X ** 하지만, class는 id와 다르게 여러개를 지정할 수 있기 때문에, 뒤에 indexing을 꼭 해줘야한다. 위에 코드를 아래와 같이 바꿔줘야 작동을 한다. (class를 찾은 것 중에 몇번째인지 써줘야 함) document.getElementsByClassName('title')[0].innerHTML..