본문 바로가기

JavaScript6

[JavaScript] AJAX AJAX 2024. 11. 15.
[JavaScript] AJAX 시작해보기 개발을 하면서 이미 사용하고있긴 했지만 제대로 다뤄보기 위해서 차근차근 정리해보려한다.AJAX(Asynchronous JavaScript ans XML): 비동기 자바스크립트와 XML의 약자이며 JavaScript의 라이브러리 중 하나이다.웹 개발을 할 때 데이터를 서버와 주고받으면서 페이지 전체를 새로고침하지 않고 일부 내용만 동적으로 업데이트 할 수 있게 해준다. 다음과 같은 기술들을 조합해서 사용하곤 한다.HTML/CSS: 웹 페이지 구조와 스타일을 정의JavaScript: 동적 동작 및 로직 구현XMLHttpRequest 또는 Fetch API: 서버와의 비동기 통신서버 측 언어(예: PHP, Python 등): 서버 로직 처리데이터 포맷: JSON, XML, 텍스트 등예시로는 다음과 같은 형태로.. 2024. 11. 14.
[JavaScript] Enter(엔터) 키 입력 이벤트 jsp로 로그인 화면을 만들던 중 엔터로도 로그인 버튼이 작동하도록 수정을 해야했다. 처음에는 아래와 같이 버튼 클릭으로 로그인이 되도록 되어 있었다. 엔터키로 로그인이 되도록 간단하게 찾아보았다. 텍스트 입력 부분에 window.event.keyCode==13 이란걸 추가하면 눌리는 키를 식별해서 해결할 수는 있었다. 이렇게하면 기능은 문제없이 작동한다. 하지만, event 라는 단어에 취소선이 그어지면서 내용을 확인해보니 event.keyCode는 브라우저 표준이 아니라 권장되는 방식이 아니라는것 같다. 그래서 다른 방법을 찾아보려하기전에 갑자기 궁금증이 생겨서 찾아본것이 있었다. onkeyup, onkeydown, onkeypress의 차이점들은 무엇일까? onkeyup 키를 눌렀다가 놓았을 때 이.. 2023. 1. 6.
[JavaScript] JSON과 데이터 전달 JSON(JavaScript Object Notation): 브라우저와 서버 사이에 오고가는 데이터를 사람이 읽을 수 있게 하기 위한 데이터 포맷. 주로 데이터는 "속성:값"과 같이 쌍을 이루는 식으로 표현된다. 예시) {"name":"John"} 하나의 쌍이 아닌 여러 값을 넣어서 배열로 표현하는 것도 가능하다. 예시) { "name1":"John", "name2":"Evan", "name3":"Marko" } 더 복잡하게 보내려면 이렇게도 가능하다. 예시) [ { "name": "Molecule Man", "age": 29, "secretIdentity": "Dan Jukes", "powers": [ "Radiation resistance", "Turning tiny", "Radiation blast.. 2022. 12. 15.