I'm sw engineer!

$(document).on('click', 'div.dv-headLine', function (evt) { const $evt = $(evt.currentTarget); const expendYn = $evt.attr('aria-expanded'); // 'true' or 'false' as string console.log("expendYn ===> ", expendYn); if (expendYn === "true") { // collapse가 열렸을 때 $evt.find('span.collapsed-reveal').show(); // or .css('display', 'inline') } else { // collapse..

let a, b, c;a = b = c = 10;console.log(a); // 10console.log(b); // 10console.log(c); // 10 ❌ 잘못된 예제 (객체를 공유하게끔)let obj1, obj2;obj1 = obj2 = { name: "Alice" };obj1.name = "Bob";console.log(obj2.name); // "Bob" (obj2도 영향을 받음) ✅ 올바른 방식(독립하는 방식)let obj1 = { name: "Alice" };let obj2 = { ...obj1 }; // 객체 복사obj1.name = "Bob";console.log(obj2.name); // "Alice" (obj2는 영향을 받지 않음) 주의할점부분적으로는 간결한 코드를 작성했지만,..

🚨 오류가 발생할 수 있는 코드 dnaList.result.dnListDtlList.forEach((item) => { console.log("item ===> ", item);}); ✅ 최적셔널 체이닝( ?.)을 사용하여 안전한 코드dnaList.result.dnListDtlList?.forEach((item) => { console.log("item ===> ", item);});

특정 속성에 접근할 때, 해당 속성이 null또는 undefined오류를 방지 🚀 즉, ?.당신을 사용하면 존재하는지 확인하는 if방법 없이 안전하게 속성에 접근할 수 있습니다!const obj = { user: { name: "Alice", age: 25 }};// 일반적으로 속성 접근console.log(obj.user.name); // 출력: "Alice"// 존재하지 않는 속성에 접근 (오류 발생)// console.log(obj.user.address.street); // ❌ TypeError: Cannot read properties of undefined (reading 'street')// ✅ 옵셔널 체이닝 사용console.log(obj.user...

내용 보기 / 숨기기 이 부분은 클릭하면 나타나고 다시 클릭하면 숨겨집니다. 2️⃣ 설명data-bs-toggle="collapse":클릭하면 해당 요소의 collapse기능을 활성화합니다. => 헤드 설정data-bs-target="#collapseExample": 숨기거나 참여대상 요소를 id입력합니다. => 숨기거나 표시할 body 의 id 작성: 숨길 요소를 감싸는 것 div. => 숨기거나 표시할 body에 class 와 id 정하기

$div.data(item); 📌 왜 사용할까요?데이터의 분류 및 분류item저장소 DOM 요소(`$div)에 저장하면, 이후 이벤트가 발생합니다.예를 들어, 클릭 이벤트 $(this).data()를 사용하여div에그디데이터DOM 조각 없이 데이터를 활용data-*속성 사용자예시 $('.accordion-item-wrap').on('click', function() { const itemData = $(this).data(); console.log(itemData); // 클릭한 div에 저장된 item 객체 출력}); 🔍예제 코드items.forEach((item) => { const $div = $(''); const html = this._dataConverter(item)..

// HTML 태그 제거 및 줄바꿈 처리 let text = data .replace(/]*>/g, "\r\n") // → 개행 문자로 변환 .replace(/]*>/g, "") // 모든 HTML 태그 제거 .replace(/ /g, " ") //  를 공백으로 변경 .trim(); // 앞뒤 공백 제거

변형되지 않는 현상 발생.기존 코드.replace(//g, "\r\n") // → 개행 문자로 변환 변경 코드.replace(/]*>/g, "\r\n") // 태그(속성 포함) → 개행 문자로 변환

$('#example').DataTable({ responsive: { details: false }});의미:responsive: DataTables에서 화면 크기에 따라 자동으로 컬럼을 숨기거나 표시하여 반응형 UI를 지원하는 옵션입니다.details: false: 반응형 처리 시 숨겨진 컬럼에 대한 추가 상세 정보 표시를 비활성화합니다.동작 방식:responsive가 활성화되면 화면 크기가 작아질 때 일부 컬럼이 숨겨질 수 있습니다.기본적으로, 숨겨진 컬럼의 데이터는 클릭 시 + 버튼을 눌러 상세 보기(details 기능)에서 확인할 수 있습니다.details: false를 설정하면 이 상세 보기 기능이 비활성화되어, 숨겨진 데이터가 아예 표시되지 않습니다.  기본 설정 (d..

if (this.$table.dataTable().fnSettings().fnRecordsDisplay() > 0) { // Execute logic if there are records displayed}this.$table.dataTable()DataTable 인스턴스를 초기화하거나 검색합니다..fnSettings()DataTables의 내부 설정 개체를 가져옵니다..fnRecordsDisplay()적용된 필터를 고려하여 현재 표시된 레코드 수를 반환합니다.