본문 바로가기

JavaScript31

[Javascript] 자바스크립트 while()문 사용방법 & 예제, 반복문 빠져 나오는 방법 안녕하세요. 오늘은 자바스크립트의 반복문중 하나인 while()문에 대해서 설명 드리겠습니다. for()문 다음으로 제일 많이 쓰이게 되는 반복문중 하나인거 같습니다. 아래의 소스코드 예제를 통해서 설명하겠습니다. 소스 예제 1-1. 'a'에 정수를 셋팅 해줍니다. 1-2. while()문의 동작 방식은 if()문과 비슷합니다. while()문 안에 비교문을 넣어 주면 비교문이 true일 동안 반복을 진행합니다. 1-3. 글 중간에 if()문 안에 'break'를 걸어주어 'a'의 값이 '7'과 같을 경우 while문을 빠져 나갑니다. ↓ 소스참조 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 // 정수 셋팅 var a = 1; // if()문과 비슷함 'a'의 값이 10보다 작은동아 .. 2020. 3. 23.
[Jquery] 제이쿼리 change 이벤트 사용방법 & 예제, change 이벤트 소스코드로 정리와 설명 안녕하세요. 오늘은 제이쿼리(Jquery) change()에 대해서 알아보겠습니다. - change 이벤트란? 제이쿼리 change 이벤트의 경우 셀렉터를 정하여 해당 셀렉터의 값이 변할경우 변화를 캐치하는 이벤트입니다. - 소스코드 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 32 33 alert($(this).val()); // 제이쿼리 change 함수 $("#testChange").change(function(){ // 변경된 값으로 비교 후 alert 표출 if($(this).val() == ""){ alert("저의 이름은 길길동 입니다."); } else if($(this).val() =.. 2020. 2. 27.
[Javascript] 자바스크립트 onchange() 사용법 & 예제 (데이터 가져오기 포함) 안녕하세요. 오늘은 자바스크립트(Javascript) onchange() 이벤트에 대해서 알아보겠습니다. 자바스크립트 onchange의 용도는 셀렉트박스의 값이 변경될때 자주 사용됩니다. 셀렉트박스의 값이 변경될때 onchange() 이벤트에서 사용자가 지정한 함수를 호출하여 각각의 동작(스크립트)을 실행 시킵니다. - 소스 설명 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 32 33 34 35 // onchange에서 호출하는 함수. function testChange(obj){ // 'obj'는 this를 지칭하는 것입니다. alert($(obj).val()); // 값 비교로 테스트 가능. if.. 2020. 2. 26.
[Jquery] 제이쿼리 텍스트(문자열) 변경 실시간 감지방법 설명(간단) 안녕하세요. 현재 onchage()를 이용해서는 text나 textarea의 경우에는 값을 적고 있는 시점에는 값의 변경을 감지하지 못합니다. (foucs out일 경우는 체크) 그리하여 오늘은 input 타입 text에서 문자열이 변경됐을때 실시간으로 현재 변경된 값을 바로 읽어 드릴수 있는 방법에 대해서 설명 드리겠습니다. - 소스코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 var newValue; // 모든 텍스트의 변경에 반응합니다. $("#testOnchange").on("propertychange change keyup paste input", function() { // 현재 변경된 데이터 셋팅 newValue = $(.. 2020. 2. 19.
[Jquery] 제이쿼리 텍스트 변경 .text() .html() (예제포함) 안녕하세요. 오늘은 제이쿼리(Jquery) text(), html() 이벤트에 대해서 알아보겠습니다. 저희가 웹 개발을 하면서 상당히 자주 쓰이게 되는 이벤트 입니다. - text()란? text()이벤트란 $(셀렉터).text() 셀렉터의 문자를 변경 해주는 것입니다. text()는 태그는 반영되지 않고 문자열로 표시가 됩니다. - text() 소스 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 // 버튼 클릭 함수 $("#testClick").click(function(){ // 'testText'라는 id의 텍스트를 '안녕하세요 김철수 입니다.'라고 변경. $("#testText").text("안녕하세요 김철수 입니다."); }); 안녕하세요. 홍길동입니다. .. 2020. 2. 19.
[Jquery] 제이쿼리 Ajax 설명 사용법 및 예제(간단) 안녕하세요. 오늘은 제이쿼리 AJAX에 대해서 설명드리겠습니다. - AJAX란? Ajax란 (asynchronous Javascript and XML)의 줄임말 입니다. 자바스크립트를 이용하여 비동기 식으로 서버와 통신을 합니다. 비동기통신이기 때문에 서버에 요청이 가더라도 화면의 깜빡 거림이나 화면이 이동 된다는 느낌을 주지 않고 상당히 자연스럽고 빠르게 클라이언트의 화면을 변화 시켜줍니다. 최근에는 XML형식이 아닌 JSON형식을 더 많이 사용하고 있습니다. - AJAX의 장단점 ♣장점 ● 서버에서 처리가 완료될때까지 기다리지 않고 다른 프로세스를 진행할 수 있다. ● 비동기 방식이기 때문에 동기 방식과 다르게 UI를 변경할 수 있어서 장점이 된다. ● 웹페이지 속도향상. ♣단점 ● 연속으로 데이터를.. 2020. 2. 14.