[JS]챗봇,회원가입,DOM 등

✔챗봇

자바 - 채팅은 사람들이 너무 많이 저속하거나 채팅 내용을 db에 저장할 때

자바스크립트 - 채팅은 사람들이 보여지는 창, 채팅내용 x

✔사용한 태그 와 스타일 요소

-.사용자가 메세지를 입력하면 채팅봇이 바로 대답하지 않고 1초가 있다가 대답하는 태그 코드

-> setTimeout() 

-.user와 채팅봇이 있는데 메세지를 보내는게 유저인지 채팅봇인지 넣게 하는거.

  css를 넣기위해 추가한 구문

                                                                         user | bot

-> messageElement.classlist.add("message", sender +"-message");

.스타일에서 사용한 태그

.챗콘테이너 꾸미는데 div 안에서  꾸며주는 스타일 요서

＊justify-content:center ; //div안에서 가운데 정렬하기

＊ justify-content:space-between ;  //맨 끝으로 이동하기

＊flex-direction: column; //div 안에서 맨 밑으로 내리기

＊overflow-y  세로로 내용이 넘칠 때 어떻게 보이는지 선택하는 속성

＊overflow-x  좌우로 내용이 넘칠 때 어떻게 보이는지 선택하는 속성

＊align-self : 안에 있는 태그들 정렬 상태 설정

      flex  : 태그의 축 정렬을 설정

      flex-end : 태그를 맨 끝부분(아래쪽 또는 오른쪽) 정렬

      flex-start : 태그를 맨 시작부분(위쪽 또는 왼쪽)정렬

 

✔DOM(Document Object Model)

 HTML(웹문서, 웹페이지) 문서를 객체 기반으로 표현한 것
      -> HTML 문서에 작성된 내용을 트리구조(계층형으로 표현)로 나타냈을 때
         각 태그, text, commnent 등을 node

         document : {
               DOCTYPE : html,
               HTML :{
                HEAD : {
                  TITLE : {TEXT : "문서제목"};
                  STYLE : {CSS 내용},
                  META : {charset : "utf-8",...},
                  },
                  BODY : {
                    H1 : {TEXT : "제목"}
                    DIV : {...}
                  }
                }= inputbox.value.trim(); //trim 공백제거