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

[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 - dblclick 이벤트 (= ondblclick 속성) ★ - 마우스더블클릭이벤트
DOM_Event JS - drag 이벤트 (= ondrag 속성) - 마우스드래그이벤트 (IE9) ※ 드래그앤드롭
DOM_Event JS - dragend 이벤트 (= ondragend 속성) - 마우스드래그종료 (IE9)
DOM_Event JS - dragenter 이벤트 (= ondragenter 속성) - 드래그진입 (= 드래그엔터이벤트)
DOM_Event JS - dragleave -
DOM_Event JS - dragover 이벤트 (= ondragover 속성) -
DOM_Event JS - dragstart 이벤트 (= ondragstart 속성) - 마우스드래그시작 (IE9)
DOM_Event JS - drop 이벤트 (= ondrop 속성) -
DOM_Event JS - durationchange -
DOM_Event JS - ended -
DOM_Event JS - error 이벤트 (= onerror 속성) - 외부파일로드 중 에러발생시 실행 (= 에러 이벤트 …
DOM_Event JS - focus 이벤트 (= onfocus 속성) - 포커스이벤트발생
DOM_Event JS - focusin 이벤트 (= onfocusin 속성) - 해당요소(또는 자식요소) 포커스 될 때 이벤…
DOM_Event JS - focusout 이벤트 (= onfocusout 속성) - 해당요소(또는 자식요소) 포커스 잃을 때…
DOM_Event JS - fullscreenchange -
DOM_Event JS - fullscreenerror -
DOM_Event JS - hashchange -
DOM_Event JS - input 이벤트 (= oninput 속성) ★ - 입력이벤트 (= 인풋이벤트) (IE9)
DOM_Event JS - invalid -
DOM_Event JS - keydown 이벤트 (= onkeydown 속성) ★ - 키보드키누르기 (= 키보드키누름 = 키다…
32/67
목록
찾아주셔서 감사합니다. Since 2012