-
Javascript, jQuery 2023‧03‧21
JS - 요소의 display 값 가져오기
자바스크립트로 해당 요소의 스타일 중 display 값이 none 인지 block 인지 알고 싶을 경우 아래와 같이 처리한다.
-
Javascript, jQuery 2023‧01‧03
new Date 지난 달 가져오기 (특히 1월이면 지난 해 12월)
이렇게 하면 오늘 기준의 지난 달 정보를 가져온다.2022년 12월 12일 이면 2022년 11월 12일의 정보를 가져오고, 2023년 1월 12월 이면 2022년 12월 12일 정보를 가져온다. 여기서 추가로 지난 달 정보의 년,월,일 정보를 가져올 때는 아래 코드를 추가한다.
-
Javascript, jQuery 2022‧10‧17
배열의 마지막 값 가져오기
slice(-1)을 이용해서 배열의 마지막을 가져올 수 있다. 하지만 이렇게 하면 배열의 마지막 값만 배열에 담기는 것이라["E"]가 된다. 그렇기 때문에 "E" 만 받아오려면 아래처럼 다시 배열안의 값을 가져온다. 또는 아래처럼도 배열의 마지막 값을 가져올 수 있다.
-
Javascript, jQuery 2022‧10‧11
논리연산자(논리합 논리곱) 단축평가
검색해서 나온 설명들이 어려워서 정리해봤다. 논리곱 (&&) A 조건이 맞으면 A, 그렇지 않으면 B 를 반환한다.이걸 if 문으로 풀자면 if(A){ A } else { B } 인데 단축평가이기 때문에 이렇게 if 처럼 연산되지 않고 A를 바로 반환한다. 그냥 이해하기 쉽게 이렇게 if 로 풀어봤다. 논리합 (||) A 조건이 안맞으면 A, 그렇지 않으면 B 를 반환한다.이걸 […]
-
Javascript, jQuery, Reactjs, Tools 2022‧07‧15
js - 채널톡 삽입(커스텀 버튼, 뱃지 카운트, 서포트봇 양식 연동)
요즘 채널톡(https://channel.io/)을 이용해서 웹사이트에 채팅 상담을 하는 기능을 만드는 데 기본 제공하는 스크립트를 넣어 아래처럼 버튼 설치 및 설정을 통해 쉽게 구현할 수 있다. 그러나 이렇게 삽입을 하면 아래 이미지처럼 기존 웹사이트의 최상위 레이어로 위에서 생성한 버튼이 고정 노출되게 된다. 하지만 웹사이트 개발할 때 기존 웹사이트 ui/ux 맞게 채널톡 버튼을 만들고 싶고 거기에 채팅 메시지가 […]
-
Javascript, jQuery 2021‧12‧30
JS - ?? 연산자 넣어서 기본 값 넣기 (null 병합 연산자)
?? 는 널 병합 연산자 (Nullish coalescing operator) 로 ES6부터 쓰기 시작했다.지원 브라우저 체크하는게 좋다. 설명) 'A가 null 이거나 undefined이면 B로 해라' 라고 까지만 설명들을 봤다. 좀 더 디테일한 설명이 필요한데 'A가 null 이거나 undefined이면 B로 하고 그렇지 않으면 A로 하라' 라고 풀어 설명해 주는게 좋을 듯 하다. 나는 기본값을 지정해주는 용도로 사용하고 있다.위 문법 […]
-
Javascript, jQuery 2021‧10‧21
JS - 쿠키 저장, 불러오기
jQuery가 아닌 자바스크립트로만 쿠키를 저장하고 불러오고 지우는 코드 1. 쿠키 설정하기 (저장) 2. 쿠키 불러오기 (읽기) 3. 쿠키 지우기(삭제)
-
Javascript, jQuery 2021‧06‧02
window.location 으로 접속 url 정보 가져오기
개발할 때 프로토콜에 맞춰서 도메인 정보를 가져올 때가 있는데 window.location.origin 을 사용하면 된다. 하지만 ie 지원이 어디까지 개발할 것이냐 또는 다른 브라우저에서 지원을 어디까지 제공할 것이냐에 따라 사용을 못할 수 있다. 그래서 아래처럼 사용한다. 이렇게 하면 http나 https 에 따라 http: 또는 https: 로 값을 받고 거기에 hostname을 넣어 현재 접속한 url의 프로토콜과 도메인을 받아올 […]
-
AWS, Javascript, jQuery 2020‧12‧13
동영상 스트리밍 서비스 구축 (AWS s3/cloudFront, HLS, video.js)
동영상을 스트리밍 할 수 있는 방법론은 다양하다.구글을 검색하고 정리하고 다시 찾고 시도하고 해왔지만 결론은 동영상을 HLS로 인코딩하고 그 파일을 AWS의 S3에 업로드하여 cloud front에 배포되고 Javascript를 이용해서 사용자의 웹브라우져에서 스트리밍 하는 것이다. 이제부터 설명하는 플랫폼들의 UI와 기능은 2020년 12월 10일 기준으로 작성되어 차후 버전이 업데이트들 되면 다르게 작업해야할 수 있다는 점 주의해야 한다.자세한 설명은 생략하고 […]
-
Javascript, jQuery 2020‧10‧16
html2canvas 사용시 특정 영역 프린트 제외 시키기
data-html2canvas-ignore 속성으로 프린트 제외하고 싶은 엘리먼트를 지정할 수 있다.아래 예제에 data-html2canvas-ignore 속성에 true를 넣은 것을 볼 수 있다.