본문 바로가기

JavaScript/Vanila

프론트엔드 자바스크립트

반응형

AJAX

  1. AXIOS 라이브러리
    1. GET 요청 [프로미스 지원 함수]

Promise -then, -catch
async/await

2. POST 요청 및 FormData 전송

POST 요청 + async/await

 

 

form 태그 데이터를 AJAX로 전송하기위한 메서드

 

POST + async/await + FormData

 

3. 주소창 한글 [인코드 : encodeURIComponent, 디코드 : decodeURIComponent]

: 아스키문자로 표현

인코드
디코드

4. HTML 태크에 데이터 저장하기 위해 data attribute와 dataset

: 서버의 데이터 -> 프론트엔드로 전송 목적

  • data-속성명으로 접근
  • dataset.'속성명'에 값 넣으면 속성이 생김
    • dataset.monthSalary = 10000 -> data-month-salary = "10000"

 

querySelector

 

 

  • querySelector: 특정 CSS 선택자에 일치하는 첫 번째 요소를 반환하는 메서드
  • getElementById: 주어진 ID에 해당하는 요소를 반환. ID는 문서 내에서 고유해야 합니다.
  • getElementsByClassName: 주어진 클래스 이름에 해당하는 모든 요소를 반환. 클래스 이름은 여러 요소에 공통으로 사용 가능
  • getElementsByTagName: 주어진 태그 이름에 해당하는 모든 요소를 반환태그 이름은 대소문자를 구분하지 않는다.
  • querySelectorAll: 주어진 CSS 선택자에 해당하는 모든 요소를 반환. CSS 선택자를 사용하여 요소를 선택 가능.
반응형