본문 바로가기

개발일지/JavaScript + jquery

(57)
[jquery] 프론트 단에서 모바일 구분하기 function Mobile() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i .test(navigator.userAgent); }
[JavaScript] radio check div 숨기기/표시하기 문제해결 - radio 버튼을 눌렀을 때 해당 값에 해당하는 div에 있는 내용을 활성화 시키고, 해당 값이 아닌 것은 비활성화 시키기 위해서 자바스크립트 값을 onClick에 함수를 줬다. - 이 때의 문제는 페이지 로드시 온클릭에 해당하지 않기 때문에 숨김 처리해뒀던 div가 떠있다는 것이다. - 곰곰히 생각해 본 결과 onload 시에도 값을 줘야한다는 걸 깨달았다. window.onload = function() { } 윈도우 온 로드시 함수를 실행 체크 값을 가져와서 setDisplay()에 넣음 setDisplay는 라디오 버튼 onClick시 실행되는 함수로 style로 div 값을 숨기고 오픈 Jquery에 익숙해져서 자바스크립트는 전혀 기억이 나지 않았는데 이번에 공부가 되었다. 앞으로도 공부의 ..
[jQuery] js파일에서 jQuery 사용하기 function loadJQuery() { var oScript = document.createElement("script"); oScript.type = "text/javascript"; oScript.charset = "utf-8"; oScript.src = "http://code.jquery.com/jquery-1.6.2.min.js"; document.getElementsByTagName("head")[0].appendChild(oScript); } $(function(){ $() });
[JavaScript] 대화상자 Dialog Box 대화상자(DialogBox) alert()메소드 사용자에게 간단한 메세지를 보여주고, 그것에 대한 사용자의 확인을 기다림 alert() 메소드 alert대화상자 prompt() 메소드 사용자에게 간단한 메세지를 보여주고, 사용자가 입력한 문자열을 반환함 prompt 창 버튼선택 화면에 있는 버튼을 클릭하면 입력창이 뜬다. 코드에서 기본값으로 설정해둔 홍길동이 적혀있다. innerHTML을 통해서 내가 입력한 text 아이디인 글자가 화면에 뿌려진다. **innerHTML은 문서바디 안에 있는 html 코드를 자바스크립트로 조작할 수 있게 해주는 코드이다. confirm() 메소드 사용자에게 간단한 메세지를 보여주고, 사용자가 확인이나 취소를 누르면 그 결과를 불리언(boolean) 값으로 반환함 conf..
[JavaScript] 아직 생성되지 않은 HTML 요소에 속성 추가 아직 생성되지 않은 HTML 요소에 속성 추가 속성추가 안녕 속성추가 버튼을 누를 때마다 새로운 단락이 추가 되고 가장 하단에 있는 글씨(태그)가 빨간색이 되는 문장이 있다. setAttribute() .setAttribute() 괄호 안에서 선택한 요소(Element)의 속성(Attribute) 값을 정한다. 만약 속성값이 원래 있었다면 지우고 다시 넣는다. document.getElementById("para").setAttribute("style", "color:Red"); id para 안에 값을 넣는다. 어떤 값? 스타일 요소에서 속성값 빨간색 createElement() .createElement() 괄호 안에서 선택한 요소(Element)를 추가한다. var newNode = document..
[JavaScript] 문자열, 배열 관련 메소드 모음 문자열의 위치 찾기 indexOf() - 앞에서부터 찾는다. lastIndex() - 뒤에서부터 찾는다. 특정 문자나 문자열이 처음으로 등장하는 위치나 마지막으로 등장하는 위치를 반환하는 메서드이다. 전달 받은 특정 문자나 문자열을 찾을 수 없을 때는 -1을 반환한다. var str = "abcDEFabc"; document.write(str.indexOf('abc') + " "); document.write(str.indexOf('abcd') + " "); document.write(str.indexOf('abc', 3) + " "); document.write(str.lastIndexOf('abc') + " "); document.write(str.lastIndexOf('d') + " "); docu..
[JavaScript] 함수(1) 함수(function) 하나의 특별한 목적으로 작업을 수행하도록 설계된 독립적인 블록을 의미한다. 필요할 때마다 호출하면 반복해서 사용 가능! 반환문(return) 함수는 반환문을 포함할 수 있다. 호출자가 함수에서 실행된 결과를 반환을 통해서 받을 수 있다. return는 배열이나 객체를 포함한 모든 타입의 값을 반환할 수 있다. function multiNum(x, y) { return x*y; } let a = multiNum(3,4); document.write(a); multiNum(3,4) 인자값 3,4가 함수로 전달된다. 함수가 호출되고 계산을 한 뒤 리턴값이 a에 저장된다. 변수의 유효 범위 1. 지역 변수 (local variable) 2. 전역 변수 (global variable) 지역..
JavaScript의 기본과 오브젝트의 설명 JavaScript 사용자의 input값을 핸들링 하는 경우 예를들어 DOM, DOM 객체를 보이거나 안 보이게 하거나.. style을 다르게 주거나 이런 걸 컨트롤 한다. 변수 var, let, const 변수명 기능 var 동일한 변수명을 선언해도 허용 let 동일한 변수명을 선언하면 오류가 뜸 const 상수의 의미로 한 번 선언을 하면 값 수정도 못 함 10년 동안 자바스크립트에는 var만 있었지만 또 다른 타입인 let과 const가 생겼다. var 변수만을 사용해서 개발을 하는 경우. 한 페이지에 방대하게 작성했을 때 개발자가 실수로 같은 변수명을 만들어서 사용하는 경우가 있다. 그렇게 되면 앞에 썼던 변수의 값이 나도 모르게 바뀌는 불상사가 생기곤 해서 다른 변수 타입들이 생기게 된 것이다...