- Today
- Total
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 클론코딩
- function
- 배열
- 프로시저
- 워드프레스
- 트러블슈팅
- sql
- 문제해결
- javascript
- spring boot
- 함수
- JSP
- 자바스크립트
- PROCEDURE
- 티스토리챌린지
- wordpress
- 오류해결
- Hostinger
- pl/sql
- PLSQL
- Oracle
- dbeaver
- 오라클
- 환경세팅
- 이클립스
- 워스프레스
- 오블완
- 엘리멘터
- iframe
목록JavaScript (17)
개발 공부중
datapicker가 설정되어있는 input 박스를 변경할 수 없도록 readonly 를 만들고 싶었다. $('input[name=datepk]').attr("readonly",true); 처음에 readonly 를 줬더니, 키보드 입력은 안 되는데 달력은 나왔다. 찾아보니datepicker 기능을 disable 로 없애고, disabled를 지워서 다시 enable을 해주면 값이 유지되면서 텍스트박스는 활성화 시킬 수 있다.$('input[name=datepk]').datepicker('disable').removeAttr('disabled') 나중에 또 사용할 거 같아서 기록 끝!
비동기 통신 장점작업을 중단하지 않고도 웹 페이지와 상호 작용할 수 있다. 예를 들어, 데이터를 로드하는 동안 사용자는 다른 작업을 수행할 수 있다는 것.서버와 클라이언트가 동시에 작업을 수행할 수 있어 효율적이다.요청을 보낸 후 다른 작업을 수행할 수 있어서 응답 시간이 줄어든다.단점콜백 함수, 프로미스, async/await 등 알아야할 개념이 조금 더 복잡하다.어디에서 오류가 생겼는지 디버깅과 작업순서를 관리하기 힘들다. 예시 : 사용자가 버튼을 클릭하면 서버에 데이터를 요청하고, 서버에서 응답을 받은 후 결과를 웹 페이지에 표시(AJAX) Fetch Data (AJAX) 동기 통신 장점코드가 순차적으로 실행되므로 간단하다.작업이 순서대로 실행된다.요청이 완료되기 전에 다음 작..
코드 중 script를 나누어쓴 코드가 있어서 찾아봤다. 브라우저가 HTML문서를 로드할 때, 문서를 위에서 아래로 순서대로 파싱한다.
iframe 을 사용하면서부모와 자식 간 데이터 공유를 위한 방법으로 postMessage를 사용해봤다. 0. 기본문법targetWindow.postMessage(message, targetOrigin, [transfer]);targetWindow.postMessage(보내질 메시지, 문자열 "*" 혹은 URI, 객체(생략가능));//예시window.addEventListener("message", receiveMessage, false);function receiveMessage(event) { if (event.origin !== "http://example.org:8080") return; // ...}targetWindow: 메시지를 받을 창 (예: iframe.contentWindow 또는 ..
iframe을 사용하며 만날 수 있는 다양한 접근방법 정리 1. 자식 iframe에서 부모 창의 함수 호출parent.html 부모 창 child.html 자식 창 부모 함수 호출 2. iframe에서 부모 창의 요소에 접근하고 속성을 변경parent.html 부모 창의 제목 child.html 자식 창 부모 요소 변경 3. iframe에서 부모 창의 다른 iframe 요소에 접근$("#elementId", parent.frames['otherFrameId'].document)// iframe에서 부모 창의 다른 iframe(otherFrameId) 내에 있는 #elementId 요소를 찾기 4. iframe 내에서 부모 페이지 요소에 접근$('#parent..
API 를 사용하기 전에 가이드를 꼭 확인하기요청과 응답 정보가 써져있다. 아래 예시는 국토정보데이터 (1) 요청 (request)1. api 주소2. 전송방식 : get(주소창에 모든 정보담기) / post(내부적으로 정보 숨기기)3. 요청변수 (2) 응답 (response)응답 값들을 활용할 수 있다. (3)JSON 데이터 JavaScript 접근방법값을 가져오기 => data.키이름배열값 가져오기 => data.키이름[0번]
serialize() 메서드는 jQuery에서 제공하는 폼 데이터를 간편하게 문자열로 변환하는 기능이다. jQuery Ajax 에서 간편한 폼 데이터 전송이 가능해진다. 데이터를 간편하게 문자열로 변환하여 Ajax 요청의 data 속성에 넣을 수 있다. 사용방법 $('from id 혹은 name').serialize() 예시 // 사용 시 $.ajax({ url: '서버 URL', type: 'POST', data: $('#myForm').serialize(), success: function(response) { // 성공 시 실행할 코드 }, error: function(xhr, status, error) { // 실패 시 실행할 코드 } }); // HTML 폼 요소 // 미사용 시 $.ajax({..
Ajax(Asynchronous JavaScript and XML) 를 통해 비동기적으로 서버와 통신하여 페이지를 새로고침하지 않고 동적으로 데이터를 가져오거나 업데이트할 수 있다. jQuery는 이러한 Ajax 통신을 더 쉽고 간편하게 구현할 수 있도록 도와주는 라이브러리다. $.ajax({ url: '서버 URL', // 통신할 서버의 URL type: 'GET', // 통신 방식 (GET 또는 POST) data: { // 서버로 전송할 데이터 (key-value 형식) key1: 'value1', key2: 'value2' }, dataType: 'json', // 서버에서 반환되는 데이터의 타입 (json, xml, html 등) beforeSend: function() { // 통신이 시작되기..