요즘 자바스크립트로 테이블을 만들면서 cloneNode()로 행을 추가하고, 그 안에 있는 input 값들을 초기화해주는 작업을 하고 있었는데 ...자꾸 체크박스만 요상하게 초기화가 안되는 문제가 발생했당 삐용삐용.. 🚨 디버깅 시작! 체크한 상태에서 행을 추가해보면 input.checked = false; 를 했을 때는 겉보기에는 체크가 풀려있지만 F12로 확인했을 때는 checked 속성이 여전히 남아있다 ?! 🤔 분명히 해제했는데 왜? 하지만 ! input.removeAttribute("checked"); 를 했을 때는 F12로 보면 checked 속성은 사라져있는데실제로 화면에서는 여전히 체크가 되어있는 상태? 🧠 결론: 속성(Attr..

https://apexcharts.com/ ApexCharts.js - Open Source JavaScript Charts for your websiteApexCharts is a a free and open-source modern charting library that helps developers to create beautiful and interactive visualizations for web pages.apexcharts.com    원하는 차트 선택해서 들어가면    하단에 있는 코드 복사!    get started - creating your first chart     edit on codepen 클릭!     여기서 아까 복사한 코드 js에 넣어서 테스트해볼 수 있당

ready() : DOM이 완전히 로드된 후 호출 $(document).ready(function(){})$(function(){}) 외부 리소스 및 이미지 로딩과 상관없이 DOM만 로드되면 바로 실행중복 사용 가능하며 선언 순서대로 실행    onload() : 페이지 내의 모든 리소스(이미지, 스크립트, css 등)가 완전히  로드된 후 호출 $(window).onload(function(){})window.onload()=function(){} 한 페이지에서 하나의 window.onload()함수만 사용 가능가장 나중에 호출된 함수만 적용페이지 안의 이미지나 외부 파일이 로드될때까지 기다린 후 실행되어 로딩시간이 길어질 수 있음     실행 순서DOM 생성 → ready() → 이미지를 포함한 요소..

수민 만만세2 미리보기  이미지를 브라우저로 옮겼을때 창 열리는 것 막기function jcOver(){    event.preventDefault();}function jcDrop(){    event.preventDefault();}window.addEventListener("dragover", jcOver);window.addEventListener("drop", jcOver);    원래는 이렇게 창이 열리지만 preventDefault로 막았당   사진 드롭function jcDrop(){    event.preventDefault();    mgJS.innerHTML="";    let jcFiles = event.dataTransfer.files;    console.log("끌고 온 파일들..

displayflex: 아이템들을 가로 방향 혹은 세로방향으로 배치할 수 있음(1차원)grid: 컬럼과 로우의 비율이나 크기를 지정(2차원)none: 요소를 렌더링하지 않음. 영역 차지 xinline: 줄 바꿈되지 않는 한줄짜리로 width, height, 여백 지정 x (span, a, b, i, img 태그)block: 가로 영역을 모두 차지하며 항상 줄바꿈이 되어 새로운 라인에서 시작 (div, p, h, li, form 태그)inline-block : 요소 자체는 inline처럼 동작하지만(줄바꿈x) 해당 요소 내부에서는 블록 요소처럼 동작(크기나 여백을 지정할 수 있음) positionstatic(기본값) : 기본값으로 배치를 브라우저에게 맡기겠다는 의미 (브라우저 너에게 배치를 맡길겡) re..

html 파일 우클릭 - open with - other  external programs에서 visual studio code 검색    vscode에서 편집하고 스프링에서 html 한 번 찍고 실행시켜야함  vscode 추가해놓으면 vscode 추가돼있음  Refresh using native hooks or polling 체크 하면vscode에서 편집하고 스프링 안 찍어도 됨

모달 띄우기 기본  ㅎㅇ 반가옹 누르면 닫힐껄 췐틀맨 만만세 열려라 췐틀    이렇게 하면 잘 실행되는데  주의할 점!!mopen(), mclose() 대신 open(), close()로 하면 f12 눌러도 에러도 안뜨궁elements에 소스도 다 사라져있음!!↓    ↓    ↓open(), close()는 window 메소드라 새로운 윈도우가 열려버려서 open, close 예약어로 함수명 지정하면 안됨     다른 방법(같은 메소드로 사용하기)  ㅎㅇ 반가옹 누르면 닫힐껄 ..

let str1 = "수민 왕창 미웡";function disp(param){ console.log("체킁",param);} try { disp(JSON.parse(str1)); //error. 그냥 문자열이라서 안됨. 대괄호나 중괄호가 있어야 됨} catch (error) { console.log("체킁2",error); disp(str1);}체킁2 에서 에러가 나는 이유는 str1이 문자열이기 때문!대괄호나 중괄호가 있어야 json parse할 수 있음     let str2 = `[ {"name":"수민", "alias" :"덩말 미웡"}, {"name":"수민", "alias" :"덩말 미웡"}]`; function disp(param){ conso..