JavaScript14 명시적으로 UI 렌더링 이후 동작하는 방법 최근 KendoUi의 프로그레스바를 사용하다가 이상한 오류가 생겼는데 프로그레스바 호출을 분명 ajax 호출 이전에 선언 했는데도 프로그레스바가 나오지 않거나 혹은 ajax가 끝난 다음 잠깐 나왔다가, ajax 호출의 complete 부분에 선언해둔 프로그레스바를 없애는 코드에 의해 바로 사라져버리는 문제였다. KendoUi 라이브러리 자체를 못불러오는건가 싶어서 jsp에서 kendoui 라이브러리 가져오는 스크립트 위치도 바꿔보고 했는데 그냥 ajax 호출만 제외하면 잘만 나왔다 그러다 원인을 찾은게 현재 ajax 호출을 비동기로 하고있는데 KendoUi를 호출 -> (아직 KendoUi 프로그레스바 호출된 화면이 렌더링 안된 상태) ajax 호출 -> ajax 호출이 비동기라 해당 ajax 호출이 완.. 2025. 2. 21. trim() 함수 Javascript에서 문자열의 앞뒤 공백을 제거하는 함수이다 let password = " secret ";if (password.trim() === "secret") { console.log("Password is correct");} else { console.log("Password is incorrect");} let password = " secret "는 trim을 사용하면 "secret"이 된다 하지만 문자열 중간 중간에 있는 공백은 제거되지 않는다 예) " Hello World "는 "Hello World"가 된다 " HelloWorld"가 되지 않는다 2024. 6. 10. import 시 index.js 생략 예를들어 현재 파일과같은 위치에 있는 main 폴더 아래에 index.js 파일이 있다고 가정하면 import '~/main/index.js'; 일반적으로 이렇게 추가하는데 index.js 파일의 경우 파일명이 생략 가능하다import '~/main'; 이런식으로 index.js 파일은 노드 모듈 시스템 및 대부분의 모듈 번들러에서 기본적으로 가져오는 파일명이라 그렇다고 한다. 2024. 5. 7. 객체 속성을 정의하는 두가지 방법 자바스크립트에서 객체를 생성했을때 속성을 정의하는 방법은 두가지가 있다. 1. 객체 축약 문법을 사용한 방법export default { name: 'app', data() { return { testStatus: false, }; },}; ES6의 객체 축약 문법을 사용한 방법이고 2. 객체 리터럴 문법을 사용한 방법export default { name: 'app', data: { loadingStatus: false, },}; 이 두 가지 방법의 가장 큰 차이점은 자바스크립트 객체를 생성하는 방식이다.첫 번째 방법은 data 속성을 함수로 정의하고, 그 함수가 호출될 때마다 새로운 객체를 생성하여 반환한다. 이렇게 함으로써 각 컴포넌트 인스턴스가 고유한 데이터 객.. 2024. 5. 2. onkeydown, onkeyup, onkeypress onkeydown 키를 눌렀을때 이벤트이다. shift, alt, controll, capslock 등의 모든 키에 동작한다. 단 한영변환, 한자 등의 특수키는 인식 못한다. onkeyup 키를 눌렀다가 땠을 때 이벤트이다. onkeydown과 인식하는 키가 같다. onkeypress 실제로 글자가 써질때 이벤트이다. shift, tap, enter 등의 특수키는 인식 못한다. 2024. 3. 25. CK Editor 게시판이나 블로그에 보면 글 자체가 html 형태로 저장되는걸 볼수있다. 개인 프로젝트로 블로그를 개발했을땐 그저 본문을 텍스트로 저장했는데 회사 사이트의 게시판 기능 분석중 글 내용이 html 형식으로 저장되어 있는것을 확인했다. 알아보니 CK Editor란 라이브러리를 사용한것 사용법은 다음과 같다 CKEditor 해당 코드를 입력하면 블로그나 카페 등에서 자주 보이는 글 작성 폼이 보이는것을 확인할 수 있다. 2024. 3. 13. 이전 1 2 3 다음
