본문 바로가기

Dev/script37

1678. Goal Parser Interpretation leetcode javascript 해석 및 풀이 1678. Goal Parser Interpretation leetcode javascript 해석 및 풀이 You own a Goal Parser that can interpret a string command. The command consists of an alphabet of "G", "()" and/or "(al)" in some order. The Goal Parser will interpret "G" as the string "G", "()" as the string "o", and "(al)" as the string "al". The interpreted strings are then concatenated in the original order. Given the string comma.. 2024. 1. 3.
(Javascript)개발자 도구 콘솔창 차단 방법 - 사이트 이동 [경고] 개발자 도구가 감지되었습니다. (Javascript)개발자 도구 콘솔창 차단 방법 - 사이트 이동 [경고] 개발자 도구가 감지되었습니다. 1. 개발자 도구의 중요성과 사이트 보안 웹 개발자들에게 개발자 도구는 필수적인 도구입니다. 이를 통해 웹사이트의 HTML, CSS, JavaScript 코드를 확인하고, 디버깅을 수행할 수 있습니다. 하지만, 개발자 도구를 사용하여 사이트의 보안을 위협하는 행위도 가능하기 때문에, 웹사이트 보호를 위해 개발자 도구의 접근을 제한하는 것이 필요할 때가 있습니다. 2. 개발자 도구 감지 방법 개발자 도구를 감지하는 가장 일반적인 방법은 window 객체의 devtools 이벤트를 활용하는 것입니다. 예를 들어, F12 키를 눌러 개발자 도구를 열거나, 브라우저의 오른쪽 클릭 메뉴에서 '검사'를 선택할.. 2023. 12. 14.
공무원 임용령 개정안 공무원 최저승진연수 5년 단축 공무원 임용령 개정안 9급에서 3급까지, 공무원 최저승진연수 5년 단축 한국의 공무원 승진체계가 혁신의 길로 나아가고 있습니다. 이에 따라 공무원들의 승진 기회가 확대되고, 특히 우수한 역량을 갖춘 공무원들에게는 근무 연차와 관계없이 승진이 가능한 환경이 조성됩니다. 또한, 다자녀를 양육하는 공무원들에게도 승진 우대 근거가 마련되어 다자녀 양육 공무원들의 혜택이 더욱 확대됩니다. 본문: 한국의 공무원 승진체계가 혁신의 길로 나아가고 있습니다. 이에 따라 공무원들의 승진 기회가 확대되고, 특히 우수한 역량을 갖춘 공무원들에게는 근무 연차와 관계없이 승진이 가능한 환경이 조성됩니다. 또한, 다자녀를 양육하는 공무원들에게도 승진 우대 근거가 마련되어 다자녀 양육 공무원들의 혜택이 더욱 확대됩니다. 9급에서 3.. 2023. 11. 19.
에라토스테네스의 체 JS 소수 찾기 알고리즘 만들기 에라토스테네스의 체를 이용한 자바스크립트 소수 찾기 로직 소개: 에라토스테네스의 체란 무엇인가? 에라토스테네스의 체는 고대 그리스 수학자 에라토스테네스가 발명한 알고리즘으로, 특정 범위 내에서 소수를 찾는 가장 효율적인 방법 중 하나입니다. 이 방법은 특정 수의 배수를 제거해 나가며 소수만을 남기는 방식으로, 컴퓨터 과학에서도 널리 쓰이고 있습니다. 자바스크립트를 이용해 이 알고리즘을 구현한다면, 소수를 빠르고 효율적으로 찾을 수 있습니다. 자바스크립트로 에라토스테네스의 체 구현하기 자바스크립트를 사용하여 에라토스테네스의 체 알고리즘을 구현하는 과정은 다음과 같습니다: 초기화: 먼저, 소수를 찾고자 하는 범위까지의 모든 숫자를 포함하는 배열을 생성합니다. 이 배열은 초기에 모든 숫자가 소수라고 가정합니다.. 2023. 11. 15.
javascript 시간 제어 함수 setTimeout(), setInterval(), clearTimeout() javascript 시간 제어 함수 setTimeout(), setInterval(), clearTimeout() JavaScript에서 시간 제어를 위해 사용되는 함수는 크게 두 가지가 있습니다. setTimeout() 함수는 일정 시간 후 함수를 한 번만 실행합니다. setInterval() 함수는 일정 시간 간격마다 함수를 반복해서 실행합니다. 두 함수의 사용법은 다음과 같습니다. // setTimeout() 함수 setTimeout(함수, 시간); // setInterval() 함수 setInterval(함수, 시간); 함수는 실행할 함수입니다. 시간은 밀리초(ms) 단위의 시간입니다. setTimeout() 함수의 예는 다음과 같습니다. // 10초 후 "Hello, world!"를 출력합니다... 2023. 11. 6.
자바스크립트 바인딩: 개념과 활용 Javascript binding 자바스크립트 바인딩의 이해와 활용 Javascript binding 자바스크립트는 웹 개발에서 없어서는 안 될 핵심 언어 중 하나로, 동적인 웹 페이지를 만들기 위해 사용됩니다. 특히, 자바스크립트의 바인딩(binding)은 데이터와 UI 요소 간의 동적인 상호작용을 가능하게 하는 중요한 개념입니다. 이 글에서는 자바스크립트 바인딩에 대해 자세히 알아보고, 어떻게 활용할 수 있는지에 대해 설명하겠습니다. Javascript binding의 기본 개념 바인딩이란 프로그래밍에서 이름(변수, 함수 등)이 실제 데이터나 코드에 연결되는 과정을 말합니다. 자바스크립트에서는 이 바인딩이 매우 유연해서 실행 시점에 바인딩을 변경할 수 있으며, 이는 함수형 프로그래밍이나 반응형 프로그래밍에서 매우 유용하게 사용됩니다... 2023. 10. 31.
썸네일 이미지 비율 유지 영역에 꽉 차게 이미지 자르기 한 후 가운데 정렬 CSS 및 jquery 가로세로 비율 썸네일 이미지 비율 유지 및 가운데 정렬: CSS와 jQuery 활용법 웹 디자인에서 썸네일 이미지나 대표 이미지를 사용할 때, 다양한 이미지의 가로세로 비율이 다를 경우 이를 통일한 디자인으로 표현하고자 하는 경우가 많습니다. 이를 위해 이미지를 해당 비율에 맞춰 자르고, 가운데 정렬하는 방법에 대해 소개하겠습니다. 원본 이미지의 가로세로 비율이 다양함 특정 영역에 이미지를 꽉 차게 표현하면서, 넘치는 부분은 잘라내야 함 CSS만을 활용하여 원본 이미지를 수정하지 않고 원하는 디자인을 구현하고자 함 해결 방법 1. HTML 구조 이미지는 최소 2개의 wrapper에 감싸져야 합니다. 이렇게 감싸진 영역을 활용하여 이미지를 가운데 정렬하고, 넘치는 부분을 잘라냅니다. 2. CSS 스타일링 .featImg.. 2023. 10. 6.
jQuery 선택자 함수 slice() - 시작부터 끝까지 인덱스 일부만 선택하기 jQuery 선택자 함수 slice() - 시작부터 끝까지 인덱스 일부만 선택하기 소개 노트: 1번부터 10번까지 형제 요소들이 있을 때, 특정 범위의 요소만 선택하여 jQuery를 사용하여 동작을 적용하고자 할 때, jQuery slice() 메서드가 유용합니다. 이 메서드는 주어진 선택자에서 일부 요소를 선택하는데 사용됩니다. 아래에서는 이 메서드의 사용법과 활용 예제를 설명하겠습니다. 사용법 slice() 메서드는 다음과 같은 형식으로 사용됩니다: $('selector').slice(start, end).addClass('newClass'); 이 메서드를 실행하면 선택한 요소 중에서 start부터 end까지의 요소가 선택되고, addClass 함수를 사용하여 해당 요소에 'newClass'라는 클래.. 2023. 9. 7.
Tippy.js, Popper.js 사용법 tooltip 툴팁 예제 Popper.js를 활용한 툴팁 구현 방법 안녕하세요, 여러분! 오늘은 다양한 기능을 제공하는 툴팁(tooltip)을 소개하려고 합니다. 툴팁은 웹 애플리케이션에서 매우 유용한 기능 중 하나로, 사용자에게 추가 정보를 제공하거나 설명을 더하는 데 도움을 줄 수 있습니다. 이번 포스팅에서는 무료 라이브러리인 Popper.js를 활용하여 툴팁을 어떻게 구현할 수 있는지 알아보겠습니다. 소개: Popper.js와 툴팁 Popper.js는 툴팁 및 팝오버(popover)를 최적의 위치에 놓을 수 있도록 도와주는 라이브러리입니다. 툴팁을 정확하게 원하는 위치에 배치하는 것은 꽤 복잡한 작업일 수 있습니다. Popper.js는 이런 어려움을 더욱 쉽게 해결할 수 있도록 도와줍니다. 또한 이 라이브러리는 부트스트랩과.. 2023. 9. 2.
자바스크립트로 RGB 색상표 만들기 자바스크립트로 RGB 색상표 만들기 서문 RGB색상 코드는 주로 rgb(255, 255, 255)나 #FFFFFF와 같이 사용되며, 이는 컴퓨터가 이해하는 2진수로 변환되어 처리됩니다. 이러한 코드는 색상의 빛의 정도를 나타내는 옥텟(Octet) 단위로 표현되며, 이를 이용하여 다양한 색상을 표현할 수 있습니다. 옥텟과 컬러 표현 각각의 옥텟은 8비트로 구성되어 있으며, 첫 번째 옥텟은 빨간색(R), 두 번째 옥텟은 초록색(G), 세 번째 옥텟은 파란색(B)을 나타냅니다. 이 세 가지 색상의 빛의 정도를 0부터 255까지의 숫자로 표현합니다. 0은 해당 색상의 빛이 꺼진 상태를 나타내며, 255는 최대한 밝은 상태를 의미합니다. 따라서, 예를 들어 #000000은 검은색, #FFFFFF는 흰색을 나타냅니.. 2023. 8. 31.
Button scss hover not working 원인과 예제 SASS SCSS :hover 예제와 동작하지 않는 사례 - 원인과 해법 서론 SASS(SCSS)는 CSS의 확장 버전으로, 변수, 중첩 규칙, 함수 등을 사용하여 스타일시트 작성을 간편하고 효율적으로 만들어줍니다. 그리고 :hover는 웹 개발에서 자주 사용되는 유용한 CSS 의사 클래스 중 하나입니다. 하지만 때때로, SASS(SCSS)를 사용할 때 :hover가 원하는 대로 동작하지 않는 사례들이 있습니다. 이러한 문제들을 해결하는 방법과 함께, :hover를 SASS(SCSS)에서 사용하는 예제들을 살펴보겠습니다. :hover 사용 예제 먼저, 간단한 예제를 통해 :hover를 SASS(SCSS)에서 어떻게 사용하는지 살펴보겠습니다. // SCSS .button { background-color:.. 2023. 8. 9.
jQuery Javascript navigator.useragent 모바일 크롬 pc android os ios ipad check 방법과 예제 jQuery Javascript navigator.useragent 모바일 크롬 PC Android OS iOS iPad 체크 방법과 예제 서론 웹 개발을 하다 보면 사용자의 기기와 운영체제에 따라 다르게 동작해야 할 때가 있습니다. 특히 모바일 기기와 PC 간에는 화면 크기와 기능의 차이로 인해 웹 페이지를 다르게 제공해야 할 때가 많습니다. 이러한 상황에서 사용자의 기기 정보를 알아내는 것은 매우 중요합니다. 이번 블로그 포스트에서는 jQuery와 JavaScript를 사용하여 사용자의 기기 정보를 어떻게 확인할 수 있는지 알아보겠습니다. jQuery와 JavaScript로 navigator.useragent 확인하기 navigator.useragent는 사용자의 브라우저와 운영체제 정보를 담고 있는.. 2023. 8. 7.