JavaScript 기초 개념 정리
JavaScript 기본
JavaScript는 브라우저에서 동작하는 스크립트 언어(줄여서 JS)입니다. 웹 페이지와 사용자 간의 상호작용을 가능하게 합니다.
1. 사용 방법
<input type="button" onclick="alert('ok!')">
<script type="text/javascript">
alert("ok!")
</script>
<script type="text/javascript" src="js/index.js"></script>
...
5월 29일 20:57에 게시됨
jqGrid에서 서브그리드 구현 방법
서브그리드 이벤트 핸들링
jqGrid의 서브그리드 기능 구현 시 주요 이벤트:
subGridRowExpanded: '+' 아이콘 클릭 시 발동. 자동 생성된 div 엘리먼트의 ID와 행 ID 획득 가능
subGridRowColapsed: '-' 아이콘 클릭 시 발동. 서브그리드 div 자동 제거
사용자 정의 동작 구현 가능 (예: 서브그리드 대체 기능)
기본 그리드 설정
<div class="container">
<ta ...
5월 28일 17:33에 게시됨
DOM 기반 XSS 취약점 5가지 유형 분석 및 페이로드 우회 기법
HTML 구조와 자바스크립트 동작을 분석하여 DOM 기반 크로스 사이트 스크립팅(DOM XSS) 취약점을 탐지하고 페이로드를 구성하는 과정을 다룹니다. 아래에서는 다섯 가지 서로 다른 필터링 및 실행 컨텍스트에 대한 취약점 분석과 우회 방안을 코드와 함께 설명합니다.
1. URL 파라미터를 통한 innerHTML 직접 주입
첫 번째 시나리오는 URL의 쿼리 스트링을 읽어 DOM 요소 ...
5월 28일 06:34에 게시됨
vis-timeline을 사용한 동적 데이터 바인딩 및 실시간 업데이트 구현 방법
vis-timeline을 활용한 실시간 데이터 동기화 기술
vis-timeline은 고유한 시간축 시각화 라이브러리로, 다양한 데이터 유형을 처리할 수 있는 강력한 API를 제공합니다. 이 문서는 동적 데이터 연동과 실시간 갱신 기능을 구현하는 방법을 다룹니다.
핵심 기능 이해
vis-timeline은 배열 형식의 데이터 입력을 지원하며, 프로젝트 관리용 타임라인부터 복잡한 이벤트 시 ...
5월 27일 19:31에 게시됨
Elm과 JavaScript의 원활한 통합: Create Elm App에서 Ports 사용 방법
Elm과 JavaScript의 원활한 통합: Create Elm App에서 Ports 사용 방법
Create Elm App는 설정 없이도 Elm 앱을 만들 수 있는 도구로, 이는 단순히 프로젝트 시작을 용이하게 하는 데서 그치지 않고 Elm과 JavaScript 간의 원활한 통합 기능도 제공합니다. 본 문서에서는 Create Elm App 프로젝트에서 Ports 기능을 활용하여 Elm과 JavaScript 간의 데이터 전송 및 함수 호 ...
5월 26일 08:38에 게시됨
asinc/await 상세 설명
asinc/await는 JavaScript에서 비동기 작업을 처리하는 문법적 꾀임이며, Promise를 기반으로 하여 비동기 코드를 동기 코드와 유사하게 보이게끔 하여 가독성과 유지보수성을 향상시킵니다.
1. 기본慨念
asinc 키워드:
비동기 함수를 정의합니다. 비동기 함수는 항상 Promise 객체를 반환합니다.
문법:
async function myFunction() {
// 함수 본문
}
특징:
함 ...
5월 25일 18:13에 게시됨
기본 참조 타입
목차- 5.1 Date
5.2 RegExp
5.2.1 RegExp 인스턴스 속성
5.2.2 RegExp 인스턴스 메서드
5.2.3 RegExp 생성자 속성
5.3 원시 래퍼 타입
5.3.1 Boolean
5.3.2 Number
5.3.3 String
5.4 싱글톤 내장 객체
5.4.1 Global
5.4.2 Math
�조 값(또는 객체)은 특정 참조 타입의 인스턴스입니다. ECMAScript에서 참조 타입은 데이터와 기능을 하나의 구조로 조직하는 방법입니다. 참 ...
5월 25일 17:07에 게시됨
Sentry(v20.12.1) 기반 K8S 클라우드 네이티브 환경에서 JavaScript 성능 모니터링을 위한 트랜잭션 샘플링 전략
트랜잭션 데이터 양 제어 방법
Sentry로 전송되는 트랜잭션의 양은 두 가지 주요 방식으로 조절할 수 있습니다. 이는 성능 데이터 수집의 효율성과 비용 간 균형을 맞추는 데 핵심적인 역할을 합니다.
정적 샘플링 비율 (Uniform Sample Rate)
애플리케이션 내 어디서든 발생하는 모든 트랜잭션에 대해 동일한 확률로 샘플링하고자 할 경우, tracesSampleRate 설정을 사용 ...
5월 25일 13:14에 게시됨
정규 표현식 기초 및 활용
정규 표현식이란?
문자열의 패턴을 정의하여 특정 조건에 맞는 텍스트를 검색하거나 검증하는 도구입니다. 컴퓨터가 이해할 수 있는 문자열 일치 규칙을 표현합니다.
표현 방식
var regex1 = new RegExp('패턴', '옵션');
var regex2 = /패턴/옵션;
기본 매칭 문자
\d: 숫자(0-9) 하나와 매칭
\D: 숫자가 아닌 문자 하나와 매칭
\w: 영문자, 숫자, 언더스코어 포 ...
5월 24일 10:13에 게시됨
Vue에서 HTML을 Word 문서로 내보내기
개요
Vue 프로젝트에서 HTML 내용을 Word 문서로 내보내는 방법에 대해 설명합니다. 이 방법은 템플릿이 필요 없으며, echarts 차트도 포함하여 내보낼 수 있습니다. html-docx-js와 file-saver 패키지를 사용하여 구현합니다.
구현 방식은 다음과 같습니다:
HTML 요소 가져오기
페이지의 Canvas 요소를 이미지로 변환
변환된 이미지를 Word 파일에 포함하여 내보내기
...
5월 24일 04:50에 게시됨