• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Window_Console] JS - console.table() 메서드 - 콘솔에 테이블 쓰기 (= console.table메서드 = 콘솔테이블 메서드)

목차

  1. console.table() 예제 - 콘솔에 테이블 쓰기
  2. console.table() 정의
  3. console.table() 구문
  4. console.table() 예제 - 객체로 테이블 쓰기
  5. console.table() 예제 - 객체 배열로 테이블 쓰기
  6. console.table() 예제 - 특정 컬럼만 보이게하기

 

console.table() 예제 - 콘솔에 테이블 쓰기

※ 테이블 데이터에 배열 넣기

 

<script>

console.table(["홈짱닷컴", "Homzzang.com", "코딩강의"]);

</script>

 

결과값:

PS. 결과확인: F12키  >  Console탭

 

console.table() 정의

 

콘솔에 테이블 메시지 쓰기.

 


 

1.

첫 번째 매개변수 (= 테이블에 넣을 데이터가 담긴 객체/배열)은 필수.

 

2. cf.

console.clear() 메서드 - 콘솔창 청소

console.error() 메서드 - 콘솔에 에러 메시지 쓰기

console.info() 메서드 - 콘솔에 메시지 쓰기

console.log() 메서드 - 콘솔에 메시지 쓰기

console.table() 메서드 - 콘솔에 테이블 쓰기

console.table() 메서드 - 콘솔에 테이블 메시지 쓰기

 

2.

IE8 이상 주요 최신 브라우저 지원

 

 

console.table() 구문

 

console.table(tabledata, tablecolumns)

 


[매개변수]

 

tabledata

필수. 테이블 데이터. (Object 또는 Array 형태)

 

tablecolumns

선택. 테이블 컬럼명 포함하는 배열. (Array 형태)

 

 

console.table() 예제 - 객체로 테이블 쓰기

 

<script>

console.table({ site : "홈짱닷컴", host : "Homzzang.com" });

</script>

 

결과값:

PS. 결과 확인 방법: F12키 > Console탭

 

console.table() 예제 - 객체 배열로 테이블 쓰기

 

<script>

var html = { name : "HTML", role : "뼈대" }

var css = { name : "CSS", role : "디자인" }

var js = { name : "JS", role : "기능동작" }

console.table([html, css, js]);

</script>

 

결과값:

 

console.table() 예제 - 특정 컬럼만 보이게하기

 

<script>

var html = { name : "HTML", role : "뼈대" }

var css = { name : "CSS", role : "디자인" }

var js = { name : "JS", role : "기능동작" }

console.table([html, css, js], ["role"]);

</script>

 

결과값:

 


분류 제목
DOM_Event JS - paste -
DOM_Event JS - pause -
DOM_Event JS - play -
DOM_Event JS - playing -
DOM_Event JS - popstate -
DOM_Event JS - progress -
DOM_Event JS - ratechange 이벤트 - 재생 속도 변경 이벤트 (= ratechange이벤트 = 레이트체인지…
DOM_Event JS - resize 이벤트 (= onresize 속성) - 윈도우 창크기 변경 조정 (= resize이벤트…
DOM_Event JS - reset -
DOM_Event JS - scroll 이벤트 (= onscroll 속성) ★ - 스크롤이벤트
DOM_Event JS - search 이벤트 (= onsearch 속성) - 검색이벤트 (IE와 FireFox는 지원 X)
DOM_Event JS - seeked -
DOM_Event JS - seeking -
DOM_Event JS - select 이벤트 (onselect 속성) = 텍스트 선택 (= select이벤트 = 실렉트이벤트…
DOM_Event JS - show 이벤트 (= onshow 속성) - <menu> 요소가 상황에 맞는 메뉴로 표시 될 때 발…
DOM_Event JS - stalled 이벤트 - 브라우저가 미디어 데이터 사용 불가 시 실행. (= 스톨드 이벤트)
DOM_Event JS - storage -
DOM_Event JS - submit 이벤트 (= onsubmit 속성) - 제출/전송 이벤트 (= 서브밋 이벤트 = 서브미…
DOM_Event JS - suspend 이벤트 (onsuspend 속성) - 브라우저가 의도적으로 미디어 데이터 안 가져올 …
DOM_Event JS - timeupdate 이벤트 - 오디오/비디오 재생 위치 변경 발생 (= timeupdate이벤트 =…
34/67
목록
찾아주셔서 감사합니다. Since 2012