logo image
메인
기술
HOME
기술

querySelectorAll , querySelector

목록
#javascript
  • 쿼리 셀렉터
    • 역활은 CSS의 selector표현식을 사용해서 대상을 가져오게 한다.
    • 즉, jquery의 $({selector표현식}')과 같은 역활. 차이점은 이건 JS에서 바로 지원이 됨.
  • querySelectorAll
    • 링크  : 개발자.모질라.org
    • selector에 대응되는 모든 엘레멘트를 가져온다. 
    • 리턴 값을 대응되는 엘레멘트들의 리스트(배열)이다.
    • 지원버전
      • 크롬 : 1
      • FF : 3.5
      • IE : 8(부분적 CSS2 까지), 9
      • Opera : 10
      • Safari : 3.2.525.3
    • ex
      • document.querySelectorAll('div'); //문서의 모든 div
      • var f = document.formName;
        f.querySelectorAll('input[type="checkbox"]:checked'); //formName이라는 폼속의 checkbox 중 체크된 것들
  • querySelector
    • 링크 :  개발자.모질라.org
    • selector에 대응되는 모든 엘레멘트 중 최초 하나만 가져온다.
    • 리턴값은 대응되는 엘레멘트의 첫번째 엘레멘트이다.
    • ex
      • document.querySelector('div'); //문서의 모든 div 중 첫번째 엘레멘트
      • var f = document.formName;
        f.querySelector('input[type="checkbox"]:checked'); //formName이라는 폼속의 checkbox 중 체크된 것들 중 첫번째 엘레멘트
    • 지원버전
      • 크롬 : 1
      • FF : 3.5
      • IE : 8(부분적 CSS2 까지), 9
      • Opera : 10
      • Safari : 3.2.525.3
목록
댓글
  • / /
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
목록형 📅 달력형
제목
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
유용한 리눅스(LINUX) 명령어
[공지] 기술 게시판
node.js 관련 모음
#weblang
node.js 로 만든 멀티 프로세스(멀티 차일드 프로세스)
1
#weblang
css decoration
#css
금융회사 광고 문자,이메일 관련
#etc
APM에서 윈도우 ODBC를 사용할 경우.
#weblang
querySelectorAll , querySelector
#javascript
Sql Injection
#database
정보통신망 이용촉진 및 정보보호 등에 관한 법률 (2014년 5월 28일 개정, 2014년 11월 29일 시행)
#etc
adb tool을 사용한 클릭 이벤트
#android
텍스트 에디터 중 소스코딩에 쓸만한 것. Notepad++
#etc #notepad #editor #tool
MHeader 해더 출력관련 모음 클래스
#header #mheader #php
웹 재요청 방지 및 트래픽 감소를 위한 방법
#weblang
모바일 브라우저의 탭하일라이트. 클릭,터치된 대상 하일라이트 제어
#css
틀린 그림 찾기
1
#html
호스팅거
#etc
tag