자유롭고 싶은 직장인

모달 창은 사용자와의 상호작용을 요구할 때 사용되는 팝업 창의 한 형태이다. 모달 창이 나타나면 일반적으로 사용자는 모달 창 외부의 콘텐츠에 대한 상호작용을 일시적으로 중지하고 모달 창과 상호작용합니다. 모달창은 여러 종류로 쓰이는데, 대표적으로 쓰이는 몇가지를 알아보자. 모달창의 종류(레이어 팝업) 알림 창: 사용자에게 메시지를 표시하고 OK 버튼을 클릭하여 확인할 수 있도록 한다. 사용자 입력 양식: 사용자로부터 정보나 데이터를 입력 받을 수 있도록 한다. 이미지 뷰어: 이미지를 확대하여 표시하거나 다운로드할 수 있는 모달 창을 표시할 수 있다. 설정 창: 사용자 설정을 변경할 수 있는 모달 창을 표시할 수 있다. html코드 먼저 버튼을 만들어 준다. 자바스크립트 모달창 모달창을 만들어 준다.

변수란? 자바스크립트(JavaScript)에서 변수는 데이터를 저장하고 참조하기 위한 식별자(identifier) 이다. 변수는 다양한 종류의 데이터를 저장할 수 있으며, 프로그램 내에서 데이터를 조작하는 역할을 한다. 변수를 사용하면 값을 여러 번 사용할 필요 없이 변수명을 부여하여 쉽게 사용할 수 있다. 또한 변수를 사용하면 프로그램의 유지보수성이 향상되고, 코드를 읽기가 쉬워집니다. 간단하게 예제를 보자 // 변수 선언 및 값 할당 var number = 30; // 변수 참조 및 출력 console.log(name) // 결과 값 30 // 변수 값 변경 number = 10; console.log(name) // 결과 값 10 위 코드에서 number은 변수이다. 처음 변수를 선업하고 numbe..

자바스크립트를 활용하여 팝업창을 만드는 것은 비교적 간단하다. 예전에는 많이 사용했던 팝업 기능이지만 지금은 모달창으로 대체가 많이 되었다. 전에 팝업창을 계속 띄우는 악성(?)사이트도 있었는데, 지금은 거의 사용하지 않는 기능이지만 간혹 필요할 때가 있다. 팝업창을 띄우는 방법은 window.open()이란 함수를 사용하는데, onclick에 넣어서 사용하거나, 함수로 만들어서 사용하는 두가지 방법이 있다. 팝업 창이란? 팝업 창은 웹 페이지에서 새로운 작은 창을 열어 특정 내용을 표시하는 데 사용되는 UI 요소이다. 이러한 팝업 창은 일반적으로 사용자에게 정보를 제공하거나 추가적인 상호작용을 유도하기 위해 사용된다. 일반적으로 팝업 창은 현재 창과 별도의 창으로 표시되며, 사용자가 원할 때 닫을 수 ..

querySelector란?querySelector는 Javascript(자바스크립트)에서 HTML태그를 제어 할 수 있는 함수이다. 기존 Javascript(자바스크립트)에서 DOM을 선택하기 위해서는 getElementById, getElementsByClassName, getElementsByTagName 등의 메서드를 사용했다. 이러한 메서드들은 각각 아이디, 클래스, 태그 이름 등을 기준으로 요소를 선택할 수 있었다. 이 때문에 제이쿼리가 널리 보급되었다고 해도 과언이 아니다. 하지만 ES5버전 부터 querySelector가 등장했는데, querySelector를 사용하면 제이쿼리처럼 CSS선택자를 직접 사용하여 더 간단하게 요소를 선택할 수 있다. 제이쿼리 요소 선택 방법2024.03.19 ..