공부방/JS4 바닐라 자바스크립트 - Node.js로 input 값 불러오기 Node js로 로그인을 구현하기 전 먼저 input에 입력된 값 불러오기를 연습했다. const express = require('express'); const app = express(); 우선 기본적인 객체 선언 부분이다. require 함수로 express 모듈을 로딩해오고 app 객체를 선언시켜 준다. ※ const 변수는 상수라는 의미로 값이 변경되지 않는다. app.set('view engine','ejs'); app.set('views',__dirname+'/views'); app.engine('html',require('ejs').renderFile); 다음은 설정 부분이다. 1번째 줄은 뷰엔진으로 ejs를 사용한다는 의미 2번째 줄은 뷰 페이지의 기본 폴더 경로 설정 3번째 줄은 뷰파일.. 2021. 4. 16. 바닐라 자바스크립트 - 기본 문법 탐색 (2) 기본 문법 탐색에서 이어지는 글이다. 바닐라 자바스크립트 - 기본 문법 탐색 자바 스크립트 태그 만약 외부 자바스크립트를 가져올 경우 태그 위에 자신이 짜고 있던 script태그 위에 붙여주면 된다. 이것도 헤드가 아니라 바디에 써주는 이유는 위에 설명한 parkws.tistory.com 위 코드와 같이 quesrSelector() 안에 >표시를 해주면 #div1 안에 있는 input을 직접적으로 지정해 줄 수 있다. 위 코드는 select 박스를 자바스크립트를 이용하여 나타낸 것이다. 굳이 저렇게 하는 이유는 select 박스의 내용을 데이터베이스에서 가져오는 경우가 종종 있어 알아두면 나중에 유용하게 써먹을 수 있다. ※ .innerHTML은 HTML요소에 직접적으로 접근할 수 있게 만드는 문법이다... 2021. 4. 13. 바닐라 자바스크립트 - 체크박스로 display 제어 8 : 체크박스 생성 및 onclick="chked(this)" 로 체크하였을 때 chked 함수에 this 값을 넘겨줌 9 : 검은색 박스 생성 10 ~ 19 : 체크시 display=none, 아닐 시 display=block 2021. 4. 13. 바닐라 자바스크립트 - 기본 문법 탐색 자바 스크립트 태그 만약 외부 자바스크립트를 가져올 경우 태그 위에 자신이 짜고 있던 script태그 위에 붙여주면 된다. 이것도 헤드가 아니라 바디에 써주는 이유는 위에 설명한 것과 같은 이유이다. 값을 가져오는 연습을 하기 위해 텍스트 박스를 하나 만들어 그 값을 가져와 콘솔 로그에 띄우도록 코딩을 하였다. 위에서는 getElementById로 했지만 getElementsByClass 등 여러 가지로 값을 가져올 수 있다. 서울 부산 제주 제출 그리고 위처럼 하게 되면 체크박스에 체크된 요소의 값만 가져올 수 있다. 하지만 저렇게 하게 되면 스크립트 안의 코드 가 너무 길어지게 된다. 이를 해결하기 위해선 querySelectorAll() 함수를 이용하면 된다. 이 밖에도 querySelector().. 2021. 4. 12. 이전 1 다음
