[JavaScript] 즉시 실행 함수 표현(IIFE) 알아보기.

2023-07-29 1. 정의 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression)은 정의되자마자 즉시 실행되는 Javascript Function 를 말한다. 이는 Self-Executing Anonymous Function 으로 알려진 디자인 패턴이고 크게 두 부분으로 구성된다. 첫 번째는 괄호((), Grouping Operator)로 둘러싸인 익명함수(Anonymous Function)이다. 이는 전역 스코프에 불필요한 변수를 추가해서 오염시키는 것을 방지할 수 있을 뿐 아니라 IIFE 내부안으로 다른 변수들이 접근하는 것을 막을 수 있는 방법이다. 두 번째 부분은 즉시 실행 함수를 생성하는 괄호()이다. 이를 통해 자바스크립트 엔진은 함수를 즉..

• format_list_bulleted WEB/JavaScript
• · 2023. 7. 29.
• textsms

[JavaScript] 자바스크립트를 . . . 로딩 함수 만들기

2021-06-29 1. 방법 정해진 interval 마다 분기 처리를 하면 로딩효과를 낼 수 있다. // 동적으로 내용 변경하는 함수 function updateDynamicContent() { let testSpan = $('.testSpan'); let currentContent = testSpan.text(); if (currentContent === '.') { testSpan.text('. .'); } else if (currentContent === '. .') { testSpan.text('. . .'); } else { testSpan.text('.'); } } // 0.3초마다 내용 변경 setInterval(updateDynamicContent, 400); 메인 이미지 출처 : 사진:..

• format_list_bulleted WEB/JavaScript
• · 2023. 6. 29.
• textsms

[JavaScript] 자바스크립트 disabled 제어 방법(조회/추가/삭제)

2023-06-28 1. 방법 자바스크립트를 통해 특정 태그의 disabled를 조회하고 이를 추가하거나 제거하는 방법을 공유한다. // 요소의 disable 속성을 추가하는 함수 function addDisableAttribute(elementSelector) { let element = document.getElementById(elementSelector); if (element) { element.disabled = true; } } // 요소의 disable 속성을 제거하는 함수 function removeDisableAttribute(elementSelector) { let element = document.getElementById(elementSelector); if (element) { ..

• format_list_bulleted WEB/JavaScript
• · 2023. 6. 28.
• textsms

[JavaScript] 자식창의 정보를 부모창에 전달하는 방법

2023-06-21 1. 방법 부모 창에서 자식 창 열기 자식 창을 열 때, 부모 창에서 변수를 설정하여 전달합니다. 예를 들어, child.html을 열 때 URL에 프래그먼트 값을 추가하여 전달할 수 있습니다. var fragmentValue = "전달할 값"; var childUrl = "child.html#" + fragmentValue; window.open(childUrl, "popup"); 자식 창에서 부모 창으로 데이터 전달 자식 창에서 window.opener를 사용하여 부모 창에 접근할 수 있습니다. var fragmentValue = window.location.hash.substring(1); // 프래그먼트 값 가져오기 window.opener.receiveData(fragment..

• format_list_bulleted WEB/JavaScript
• · 2023. 6. 21.
• textsms

[JavaScript] 현재 URL 정보를 가져오는 방법들

2023-06-14 1. 방법 현재 URL 정보를 가져오는 방법은 window.location 객체를 사용하는 것입니다. window.location 객체는 현재 페이지의 URL과 관련된 정보를 제공합니다. 아래의 속성을 사용하여 다양한 정보를 얻을 수 있습니다: window.location.href: 전체 URL을 반환합니다. window.location.protocol: 프로토콜 (예: "http:", "https:")을 반환합니다. window.location.host: 호스트 이름과 포트를 반환합니다. window.location.hostname: 호스트 이름을 반환합니다. window.location.port: 포트 번호를 반환합니다. window.location.pathname: 경로 부분을 ..

• format_list_bulleted WEB/JavaScript
• · 2023. 6. 14.
• textsms

[JavaScript] 태그(ex div) 클릭 시 텍스트 값 가져오는 방법

2023-06-09 1. 방법 let textArray = []; function handleClick(event) { let clickedDiv = event.target; let textValue = clickedDiv.innerText; if (textArray.includes(textValue)) { // 이미 클릭된 div인 경우 textArray = textArray.filter(item => item !== textValue); // 배열에서 해당 텍스트 값 제거 clickedDiv.style.backgroundColor = ""; // 배경색 원래대로 복구 } else { // 처음 클릭하는 div인 경우 textArray.push(textValue); clickedDiv.style.bac..

• format_list_bulleted WEB/JavaScript
• · 2023. 6. 9.
• textsms