728x90 반응형 전체 글121 [javascript] event.preventDefault() 1. 사용하는 경우 페이지 이동을 하는 기본동작을 빼주어야 할 때 사용함. 우리가 보통 화면의 버튼에 이벤트를 걸기 위해서는 addEventListener 함수를 사용한다. 요소.addEventListener("이벤트", 함수명); 이벤트 중에서도 submit 이벤트는 form 내용을 제출하는 이벤트로, submit을 하게되면 action로 지정된 url로 이동하거나 url이 없는 경우에는 새로고침이 된다. ... 페이지 내 구조상, 여러 개의 form이 있고 각자 submit을 사용해야 할 필요가 있을 때 ! 페이지 이동 없이 input 내용을 submit하여 데이터를 주고 받을 수 있는 ajax 기능을 사용하게 된다. 다만 ajax는 제이쿼리에 있는 기능이며, vanilla script 로 구현하기 .. 2024. 4. 19. [javascript] classList 로 반환되는 DOMTokenList 1. DOMTokenList 의 정의 DOMTokenList The DOMTokenList interface represents a set of space-separated tokens. Such a set is returned by Element.classList or HTMLLinkElement.relList, and many others. A DOMTokenList is indexed beginning with 0 as with JavaScript Array objects. DOMTokenList is always case-sensitive. ( 해석내용 ) DOMTokenList 인터페이스는 space를 기준으로 구분되어지는 토큰의 set이다. Element.classList 또는 HTMLLink.. 2024. 4. 3. [javascript] 랜덤 로또 번호 뽑기 랜덤으로 로또번호 뽑기 만들기 - document.querySelector(cs선택자) - 요소.addEventListener("click", function) 결과물 index.html 로또번호 뽑기 app.js function getLottoNumber(){ // 숫자 6개 + 추가번호 1개 // 1~45 let html = ""; for(let i = 1; i 2024. 4. 2. 자바스크립트 객체 상속 (feat. [[Prototype]] 과 __proto__) 자바스크립트 객체 상속 (feat. [[Prototype]] 과 __proto__) 자바스크립트 객체에서도 상속관계처럼 다른 객체를 사용할 수 있다. 기본적으로 자바스크립트 객체는 숨김 프로퍼티인 [[Prototype]] 를 가진다. 그리고 [[Prototype]] 프로퍼티의 getter/setter 함수도 존재한다. 숨김 프로퍼티인 [[prototype]] 는 다른 객체로 설정해줄 수 있다. 무조건 객체타입만 가능하며, 객체 이외의 타입인 경우 설정이 무시된다. 이 Prototype 프로퍼티를, 상속관계처럼 사용할 수 있다. let animal = { walk() { // 또는 walk : function() { ... } if (!this.isSleeping) { alert(`동물이 걸어갑니다.`);.. 2024. 2. 28. 오라클 시퀀스 ↔ 테이블 시퀀스 맞추기 (동기화하기) 간혹 데이터를 이관하다보면, 해당 테이블의 pk 로 사용하는 시퀀스와, 거기에 사용되는 시퀀스의 value가 맞지 않을 때가 있다. 나는 무결성 제약위반 오류가 뜨면서 데이터가 수정처리 되지 않았기 때문에, 시퀀스를 맞춰주어야 하는 상황이었다 또 이런 상황이 생길 수도 있으니 간단한 프로시저로 만들어보았다 create or replace PROCEDURE "SYNC_SEQ" ( P_SQ_NM in VARCHAR2-- 시퀀스명 , P_TB_SEQ_NM in VARCHAR2 -- 테이블 내 시퀀스 컬럼명 , P_TB_NM in VARCHAR2 -- 테이블명 ) IS V_NEXT_VALUE NUMBER; V_MAX_VALUE NUMBER; V_CAL_VALUE NUMBER; T_NUM N.. 2024. 2. 20. [IntelliJ] 폐쇄망에서 인텔리제이 라이센스 등록하기 인텔리제이 회사용 계정이 있지만 사내 폐쇄망에서 접근하려면 일반적인 로그인으로는 안된다. 폐쇄망에서 계정 등록하여 인텔리제이를 활성화 하는 과정을 기록해본다..! 1. 인텔리제이 로그인 인텔리제이 로그인 화면 접근 https://www.jetbrains.com/ko-kr/idea/ 로그인주소로 이동해서 로그인한다. 2. 오프라인 활성 코드 겟하기 로그인 된 화면에서, Download a code for offline activation 버튼을 클릭하여 오프라인 접속코드를 다운로드 한다. 압축폴더에 txt 파일로 저장된다. 저장되는 코드파일명 형식은 [라이센스코드 - 계정이메일 - for 버전] 인 듯 하다. 나는 인텔리제이를 2021년도 버전으로 깔았으니, 아래에 있는 텍스트파일에 있는 코드를 사용했다... 2024. 2. 8. [front] 브라우저 탭 아이콘 적용하기 (favicon) 태그 안에 link 태그를 작성해주기. 2024. 2. 2. [back] 자바의 직렬화 (Serialzation : implements Serializable) 자바의 직렬화 (implements Serializable) 1. java에서 직렬화란? 데이터 객체를 전송하기 쉬운 형태로, 객체 상태를 저장하는 일련의 바이트로 바꾸는 과정 (자료구조 저장) 처음에는 이렇게 적어놓은 글들을 보면서 뭔말이지 싶었는데 이렇게 말고는 설명할 방법이 .. 2. 직렬화를 사용하는 이유 구글링 해서 접한 여러 글들을 읽어봤을 때, 내가 이해한 바는 이렇다. - 시스템과 시스템 간에, 네트워크로 데이터 교환을 하기 위해서는 서로 데이터를 알아먹을 수 있는 자료구조 양식(class)이 있어야하고, 그 양식이 이 양식인지 알아차리기 위해서는 양식번호(serialVersionUID)가 있어야 한다. 내가 사용자에게 이름과 연락처를 적을 수 있는 양식을 줬지만, 사용자는 그 양식이 어떤.. 2024. 2. 1. [front] 카카오톡 공유하기 이미지 수정하기, og:image 종종 공유하기 버튼이 들어가는 이벤트 페이지를 개발하면, 클라이언트가 특정 이미지가 공유되길 원할 때가 있다. 그럴 때 수정하는 곳이 og 태그. 태그 안에 작성해주면 된다 !! 예제 ) 내 티스토리 블로그 를 공유했을 때 1. og 태그란 - 오픈그래프 프로토콜을 의미 (창시자는 페이스북이라고 한다) - 메타태그의 property가 og로 지정되어 있는 정보를 긁어올 수 있다. 즉, 사용자가 페이지에 진입하기 전에 미리보기용 정보를 가져올 수 있게 하는 태그다. 보통 title, image, description, url을 설정한다. image의 크기는 최소 6060x315px , 1.91:1의 비율, 권장 사이즈는 1200x630px이라고 하는데,, 이미지 크기 관련해서는 https://ogp.me/ 2024. 2. 1. [front] Uncaught TypeError: object.function is not a function (jQuery와 javascript, node 가져오는 방법의 차이) 제이쿼리로 노드를 가져온 것 같은데, 해당 노드의 함수나 프로퍼티에 접근이 안될 때가 있다. 그럴 때 Uncaught TypeError: object.function is not a function 에러 발생함 이런 경우 내가 노드에 제대로 접근을 했나 봐야한다. 가져온 노드를 콘솔에 찍어보면 '? 이건뭐지?' 할 때가 있어서 정리해보려고 한다. 예1) $("#selector").val() -> jquery 함수로 value 접근 $("#selector")[0].value -> dom property로 value 접근 document.getElementById("selector").value -> dom property로 value 접근 예2) $("#selector").attr('checked') ->.. 2024. 1. 30. 이전 1 2 3 4 ··· 13 다음 728x90 반응형
