본문 바로가기

Lect & Tip111

jquery .sort() 함수를 활용한 요소 이동과 정렬 jquery .sort() 함수를 활용한 요소 이동과 정렬 소개 이번 포스팅에서는 jQuery의 .sort() 함수를 활용하여 요소를 이동하면서 정렬하는 방법에 대해 알아보겠습니다. 특히, 부서나 트리 구조의 목록에서 특정 요소를 선택하여 다른 목록으로 이동한 후, 해당 목록을 정렬하는 방법에 대해 다룰 것입니다. 상황 설정 가정해봅시다. 여러 부서를 나타내는 목록이 있고, 우리는 사용자가 선택한 부서를 다른 목록으로 이동시킨 후, 그 목록을 순서대로 정렬하고자 합니다. 예를 들어, '디지털 미디어' 팀들의 목록을 가지고 있다고 가정해보겠습니다. 먼저 복사 이동은 클릭 이벤트 발생과 동시에 .appendTo() 함수로 이동된다. 이 예시에서는 jQuery의 .sort() 함수를 활용하여 부서 이동과 소트.. 2023. 9. 1.

vscode scss compiler sass 사용하는법 .map파일이 생성되지 않게 설정 vscode scss compiler VSCode에서 SCSS 컴파일 및 .map 파일 생성 방지 설정 부제: 간편하게 SCSS를 컴파일하고 .map 파일을 생성하지 않는 방법 안녕하세요, 여러분! 이번 포스팅에서는 Visual Studio Code(VSCode)에서 SCSS(Sassy CSS)를 간편하게 컴파일하고, 불필요한 .map 파일 생성을 방지하는 방법에 대해 알아보겠습니다. 코드 작성 환경을 더욱 효율적으로 만들어보세요. 필요한 확장(extension) 다음과 같은 확장 프로그램을 설치하면 SCSS 컴파일 및 .map 파일 관리가 훨씬 간편해집니다. Sass Sass Lint Live Sass Compiler Live Server 이제 준비가 되셨다면, 시작해봅시다! SCSS 파일 컴파일하기 .. 2023. 8. 30.

linux killall node command use in windows taskkill /f /im node.exe Starting inspector on 127.0.0.1:9229 failed: address already in use 에러 해결방법 linux killall node command use in windows taskkill /f /im node.exe Starting inspector on 127.0.0.1:9229 failed: address already in use Windows 환경에서 VSCode 사용 시 발생하는 "address already in use" 에러 해결 방법 오늘은 Windows 환경에서 VSCode를 사용하면서 자주 마주치게 되는 "address already in use" 에러에 대한 해결 방법을 살펴보겠습니다. 이 오류는 종종 127.0.0.1:9229와 같은 주소에서 발생하는데, 이를 해결하기 위해 몇 가지 단계를 따라가보겠습니다. 해결 방법: taskkill 명령어 사용 유닉스 계열 시스템에서는 ki.. 2023. 8. 29.

jQuery 동적 click 이벤트 처리하기 jQuery로 동적 click 이벤트 처리하기 개요 웹 개발에서 jQuery는 많은 유용한 기능을 제공하는데, 그 중 하나는 동적으로 생성된 요소에 클릭 이벤트를 적용하는 것입니다. 이 블로그 포스팅에서는 동적으로 생성된 버튼에 클릭 이벤트를 적용하는 방법을 알아보겠습니다. 상황 설정 보통 웹 페이지에서 버튼에 클릭 이벤트를 부여할 때, $(document).ready() 함수 내에서 이벤트를 선언합니다. 하지만 동적으로 생성된 버튼의 경우, 초기화 단계에서는 해당 버튼이 존재하지 않아 이벤트가 적용되지 않는 문제가 발생할 수 있습니다. 첫 번째 버튼 위 코드에서 두 번째 버튼 (secondButton)을 클릭해도 경고 메시지가 표시되지 않습니다. 이는 두 번째 버튼의 이벤트가 초기화 단계에서 이미 선언.. 2023. 8. 23.

리액트 초기 세팅 환경 구축하기: Windows에서의 React 설치 가이드 리액트 환경 구축하기: Windows에서의 리액트 설치 가이드 안녕하세요, 여러분! 오늘은 리액트(React)를 Windows 환경에서 설치하는 방법에 대해 알아보겠습니다. 리액트는 페이스북에서 개발한 프론트엔드 라이브러리로, 컴포넌트 기반 아키텍처에 초점을 맞춘 도구입니다. 이 글을 통해 당신도 손쉽게 리액트 환경을 구축하고 첫 번째 프로젝트를 시작할 수 있습니다. 선행 설치 사항 리액트를 사용하기 위해 필요한 몇 가지 사항이 있습니다. 아래의 단계를 따라 설치해보세요. Node.js 설치: 리액트의 핵심 도구인 Webpack과 Babel은 Node.js 기반으로 동작합니다. Node.js를 설치해야 이 도구들을 사용할 수 있습니다. Node.js 공식 홈페이지에서 다운로드하여 설치해주세요. Yarn .. 2023. 8. 22.

jQuery를 이용하여 요소의 이름으로 현재 요소의 타입 알아내기 jQuery를 이용하여 요소의 이름으로 현재 요소의 타입 알아내기 안녕하세요! 이번 블로그 포스팅에서는 jQuery를 사용하여 요소의 이름을 기반으로 현재 요소의 타입을 어떻게 알아낼 수 있는지 알려드리겠습니다. 소개 웹 개발에서 종종 특정 요소의 타입을 알아내는 일이 필요합니다. 예를 들어, 다양한 입력 폼 요소 중에서 사용자가 입력한 값을 가져오려고 할 때 해당 요소가 인지, 인지, 아니면 인지 등을 구분해야 할 때가 있습니다. 방법 prop("tagName") 사용하기 var element = $("input[name='text']"); var tagName = element.prop("tagName"); console.log(tagName); // 결과 예시: "INPUT" [0].tagName .. 2023. 8. 15.

이전 1 2 3 4 5 6 7 8 ··· 19 다음

티스토리툴바