Javascript:HTML로부터 데이터 받기

학교의 모든 지식. SMwiki
Sam (토론 | 기여)님의 2022년 8월 2일 (화) 16:30 판 (새 문서: {{Javascript}} == 개요 == DOM 요소로부터 데이터를 받기 위한 기능. <code>data-변수명='넣을데이터'</code> 형태이다. === 자바스크립트 코드에서...)
(차이) ← 이전 판 | 최신판 (차이) | 다음 판 → (차이)
둘러보기로 이동 검색으로 이동

틀:Javascript

  1. Javascript:개요
  2. Javascript:변수, 상수
    1. Javascript:자료구조
  3. Javascript:연산자
  4. 분기문
    1. Javascript:조건문
    2. Javascript:반복문
  5. Javascript:선택자
    1. Javascript:요소 내용 변경
    2. Javascript:HTML로부터 데이터 받기
  6. Javascript:이벤트
    1. Javascript:클릭 이벤트
  7. Javascript:AJAX
    1. AJAX 활용
      1. Javascript:댓글달기
      2. Javascript:무한 스크롤링
  8. Javascript:활용
    1. Javascript:표 정렬

개요

DOM 요소로부터 데이터를 받기 위한 기능. data-변수명='넣을데이터' 형태이다.

자바스크립트 코드에서 받기

의도 예시코드
JQuery
데이터=$(this).data("변수명");
console.log(데이터);
javascript
var input=document.querySelector('#태그아이디');
console.log(input.dataset);  //사전형으로 저장되어 있는 데이터셋을 모두 볼 수 있다.
console.log(input.dataset['키'])  // 특정 키로 접근하고 싶은 경우.

해당 값을 변경하면 DOM 요소에도 변경된 것이 담긴다.